Need JQuery Functions to Load Several Sequential Actions From PHP - php

Question

I have a main-page.php with a simple form (id=search) that performs a live search in a MySQL database and returns results in a list like this:
echo "<ul style=\"list-style-type: none;\">";
while($row = mysql_fetch_assoc($sql)) {
echo "<li>".$row['Long_Desc']."";
}
echo "</ul>";
What I need is a JQuery function to allow me to click on any of the returned list items from the above list, but instead of being directed to next-step.php, I would like to stay on main-page.php, and have the div "results" on this page updated with the contents of the next-step.php script.
Of note, next-step.php performs another SQL search and returns results as a form element with radio buttons that are built with an echo command - something like this:
echo "<form id=choices>"
while ($line = mysql_fetch_array($result, MYSQL_ASSOC)) {
echo "<input type=RADIO name=\"food_quantity\" value=\"$line[Gm_Wgt]\">";
echo "<b>$line[Amount] $line[Msre_Desc]</b> ($line[Gm_Wgt] grams)";
}
echo "<INPUT type=RADIO name=quantity>";
echo "<INPUT type=text NAME=my_quantity SIZE=4 value=\"\"> <b>grams</b>";
echo "<input type=submit name=Submit value=\"Submit\">";
echo "</form>";
Finally, what I'd like to be able to do with the form "choices" is to check a radio button option, send the selection to an external php page (let's call it last.php), where yet another SQL search is performed, the results of which should then be returned as a blcok of formatted HTML into the original "results" div of main-page.php.
Thank you for your help!

Answer 1

Here are the simple and easy 4 steps that i would recommend you and you shall customize it to your need
Step 1 : Write a Jquery function onclick()
<script>
$( "#yourID" ).click(function() {
$( this ).slideUp();
});
</script>
Step 2 : Do an ajax call and send value to the Server
$.post( "yourServer.php", { data: "yourData" })
.done(function( data ) {
});
Step 3 : Get the value in server side
$data = $_POST['data'];
#Do some process and get the result
Step 3 : Send the Results
echo json_encode($yourData)
Step 4 : Get the results in JQuery success event & Show in the div that you need to update
if(success.data==1)
{
$('#yourResult').html(data.name);
}
else
{
$('#yourResult').html(data.error);
}
Hope this helps you !