Reputation: 103
I want to show my filtered data in the arrays in the textboxes...I’ve been looking in google for days already for the same idea of my program that works but I cant find any help me please.
As you can see my current code doesn’t work and I need your help guys.
example expected output:
html code:
<form name="form" method="get">
Search batchcode: <input type="text" id="query" name="search" /><br />
<table>
<tr>
<td>
ID: <br />
<input id="id1" type="text" name="id1" /> <br />
<input id="id2" type="text" name="id2" /> <br />
</td>
<td>
Name: <br />
<input id="name1" type="text" name="name1" /> <br />
<input id="name2" type="text" name="name2" /> <br />
</td>
<td>
Score 1: <br />
<input id="optA1" type="text" name="optA1" /> <br />
<input id="optA2" type="text" name="optA2" /> <br />
</td>
<td>
Score 2: <br />
<input id="optB1" type="text" name="optB1" /> <br />
<input id="optB2" type="text" name="optB2" /> <br />
</td>
<td>
Other Qualification: <br />
<input id="other_qual1" type="text" name="other_qual1" /> <br />
<input id="other_qual2" type="text" name="other_qual2" /> <br />
</td>
<td>
Interview: <br />
<input id="interview1" type="text" name="interview1" /> <br />
<input id="interview2" type="text" name="interview2" /> <br />
</td>
<td>
Total: <br />
<input id="total1" type="text" name="total1" /> <br />
<input id="total2" type="text" name="total2" /> <br />
</td>
</tr>
</table>
</form>
script code:
<script type="text/javascript">
$(document).ready(function(){
$('input[name^=search]').click(function(){
$.ajax({
url:"search.php",
type:"GET",
data: { term : $('#query').val() },
dataType:JSON,
success: function(result) {
$('#id1').val(result.id).show();
$('#id2').val(result.id).show();
$('#name1').val(result.name).show();
$('#name2').val(result.name).show();
$('#optA1').val(result.score1).show();
$('#optA2').val(result.score1).show();
$('#optA1').val(result.score2).show();
$('#optA2').val(result.score2).show();
$('#other_qual1').val(result.other_qual).show();
$('#other_qual2').val(result.other_qual).show();
$('#interview1').val(result.interview).show();
$('#interview2').val(result.interview).show();
$('#total1').val(result.total).show();
$('#total2').val(result.total).show();
}
});
})
});
</script>
search.php page:
<?php
$q = $_GET['term'];
mysql_connect("localhost","root","");
mysql_select_db("test");
header('Content-type: application/json');
$query = mysql_query("SELECT * FROM score WHERE batchcode LIKE '%$q%'");
$data = array();
while($row = mysql_fetch_array($query)){
$data[] = array('value'=>$row['batchcode'],
'id' => $row['id'],
'name' => $row['name'],
'score1' => $row['score1'],
'score2' => $row['score2'],
'other_qual' => $row['other_qual'],
'interview' => $row['interview'],
'total' => $row['total']
);
}
echo json_encode($data);
?>
when I go to search.php
page I get this output:
Upvotes: 0
Views: 120
Reputation: 221
you are assigning same data to your elements in the ajax callback function .
you need to loop through the data returned from AJAX call and assign it to the various elements
for(i=0;i<data.length;i++){
//first loop for first set of records and second for second set of records
$(selector).val(data.attr);
}
Upvotes: 0
Reputation: 1733
$_GET['term'];
is undefined.
You need to do this:
search.php?term=myTerm
Upvotes: 1