how can i load an external page into a div using jquery?

Question

i have a menu with 3 links, when the user clicks on a menu link i want the page to load on a div on the same page using jquery, im using php and mysql!

thank you!

Answer 1

Take a look at the jQuery.get() function.

Answer 2

http://api.jquery.com/load/

$('#result').load('ajax/test.html');

Answer 3

I suggest you to read some docs @ jQuery.

Btw this might be your answer:

$.ajax({
  url: 'ajax/test.html',
  success: function(data) {
    $('.result').html(data);
    alert('Load was performed.');
  }
});

Answer 4

$('#local_container').load('external/file.php #external_container');

http://api.jquery.com/load/

Answer 5

Expanded from @jAndy's example:

Markup:

<a href="/foo/bar.html" id="baz">Load external html</a>
<div id="result"></div>

JavaScript

$('#baz').click(function () { $('#result').load(this.href); });

Answer 6

You can use ajax to gather information from mysql database.

$.ajax({
  type: 'post',
  url: 'getnames.php',
  datatype: "json",
  success: function(data) {
    $('#id_of_the_div').text("");
    $('#id_of_the_div').append(data.returned);
  }
});

in the php file:

//..
// commands that run mysql queries and gather information from database
//..
//..
//..
// you store what you've got from the database in a $ret variable and then:
// $ret can be for example:
// $ret = "<table><tr><td>Peter</td><td>40</td></tr></table>";

$arr = Array("returned"=>$ret);
echo json_encode($arr);

Of course this was just an example from the several ways you can use. I've used ajax request and json...