I want to load the results of a form into a div without refreshing the page. The result should load if an option is selected. By selecting the option submits the form without page refresh and then load the result. Here is the code, how would i use jquery with this
<form name="form" action="show.php" method="GET">
<select name="school" >
<option value="">School</option>
<option value="1">St.Peter</option>
<option value="2">JHS</option>
</select>
<input type="submit" name="Submit" value="Search" >
开发者_开发知识库</form>
<?php
$s = $_GET['school'];
if($q && ($s =='1')){echo "St.peter H.S";}
elseif($q && ($s=='2')){echo "JHS";}
else echo "Enter something";
?>
HTML:
<form name="form" action="show.php" method="GET">
<select name="school" >
<option value="">School</option>
<option value="1">St.Peter</option>
<option value="2">JHS</option>
</select>
<input type="submit" name="Submit" value="Search" >
</form>
<div id="result"></div>
PHP:
<?php
$s = $_GET['school'];
if($q && ($s =='1')){echo "St.peter H.S";}
elseif($q && ($s=='2')){echo "JHS";}
else echo "Enter something";
?>
jQuery:
$(document).ready(function(){
$('select[name="school"]').change(function(){
$.get('show.php', {school : $(this).val()}, function(data){
// use .append(data), if you don't want to remove the previous content
$('#result').html(data);
});
});
});
append()
would be what you're looking for! Make sure you are appending to the right parent and you'll want use addClass()
to style your newly created element! Good luck.
精彩评论