getting query string php - jquery - #?id= - php

Question

I am really stuck and was wondering if someone could lend a hand please,
i know how to get a query string, thats not a problem,
however,
I have links that use jquery to fade out the content and load the new content via links,
usage example below - class="link2" is a reference for the jquery to do what it does lol
click here
in the href i have to have the # first to stop the page from loading if you get what i mean,
now when i try and get the query string id=2 it says none as there is a # first, there is probably a simple fix for this but i must just be missing it,
i have searched and searched but still cant find the answer
----------------------edit------------------------------
this is what i am trying to do,
enter page,
sql query runs to display all the reports
click a report and the jquery hides "contmain" and shows "contreports" now a new sql query runs to display the report based on the "id"
now usually i can just get this information from the url and clean it up, hovever as i have jquery running i need to have the "#" for the href so the page does not reload and the jquery can run, but now this is stopping me from being able to retrieve the url query,
Interstellar_Coder
he seems to have the right idea, passing it in the background

Answer 1

Although i don't fully understand what you're doing, i'm guessing it would be better to store your querystring as a data attribute.
click here
Then in your jQuery function.
$('.link2').click(function(e){
var queryString = $(this).data('id');
e.preventDefault(); // prevent the default action
});

Answer 2

because of the code i thought it best to post here
i think i am getting close,
#Interstellar_Coder - this is what i have so far but it only ever retrieves the first id,
$query1 = mysql_query("SELECT * FROM `".TBL_CATCH_REPORTS."` order by id DESC");
$query2 = mysql_num_rows($query1);
if(mysql_num_rows($query1) != 0) {?>
<table width="880" style="margin:0 auto">
<?PHP while ($output = mysql_fetch_assoc($query1)) { ?>
<tr class="row">
<td width="190px"><input type="button" class="c_report"value="<?PHP echo $output['id']; ?>" />
View Report <img src="images/icons/arrow_right.png" width="16" height="16" /></a></td>
<td width="210px">Submited by <?PHP echo $output['submitby']; ?></td>
<td width="160px"><?PHP echo $output['date']; ?></td>
<td><?PHP echo $output['title']; ?></td>
</tr>
<?PHP } ?>
</table>
<?PHP }else{ echo '.Sorry there are no catch reports yet'; }?>
<div id="contreport"> content here </div>
<script type="text/javascript">
$(document).ready(function(){
$(".c_report").click(function () {
$("#contreport").html('Getting Catch Report......');
$.ajax({
type: "POST",
data: "data=" + $(".c_report").val(),
url: "reportdata.php",
success: function(msg){
$("#contreport").html(msg)
}
});
});
});
</script>
my other page "reportdata.php just gets the value and is then used in a sql statement
$getreport = '';
if (isset($_POST['data']) and trim($_POST['data']) != '' ) {
$getreport = trim($_POST['data']);
}
i am assuming i need some kind of loop going on in the jquery but i am just lost, been stuck on this all day today again lol
this is all i need
id 1 - link
id 2 - link
id 3 - link
id 4 - link
id 5 - link
click on any and the id will be sent to reportdata.php where the id will be used in a sql statement, then the data returned and displayed,
its truly sending me mad lol