How to Load In Content with jQuery? - php

Question

I am trying to add ajax functionality to my pagination so the content loads in the same page instead of the user having to navigate to another page when clicking the page links.
I should mention that I am using this php pagination class.
Being new to jquery, I am unsure of how to properly do this with the pagination class.
This is what the main page looks like:
<?php
$categoryId=$_GET['category'];
echo $categoryId;
?>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
<script type="text/javascript" src="jquery_page.js"></script>
<?php
//Include the PS_Pagination class
include('ps_pagination.php');
//Connect to mysql db
$conn = mysql_connect('localhost', 'root', 'root');
mysql_select_db('ajax_demo',$conn);
$sql = "select * from explore where category='$categoryId'";
//Create a PS_Pagination object
$pager = new PS_Pagination($conn, $sql, 3, 11, 'param1=value1&param2=value2');
//The paginate() function returns a mysql
//result set for the current page
$rs = $pager->paginate();
//Loop through the result set
echo "<table width='800px'>";
while($row = mysql_fetch_assoc($rs)) {
echo "<tr>";
echo"<td>";
echo $row['id'];
echo"</td>";
echo"<td>";
echo $row['site_description'];
echo"</td>";
echo"<td>";
echo $row['site_price'];
echo"</td>";
echo "</tr>";
}
echo "</table>";
echo "<ul id='pagination'>";
echo "<li>";
//Display the navigation
echo $pager->renderFullNav();
echo "</li>";
echo "</ul>";
?>
<div id="loading" ></div>
<div id="content" ></div>
Marketing
Automotive
Sports
Any help on this would be great. Thanks.

Answer 1

$("a.category").live("click", showContent)
function showContent()
{
$("#content").load("/url/path/" + $(this).attr("id"));
}
will load either
/url/path/marketing, /url/path/automotive or /url/path/sports
into the content div