Memunculkan data secara otomatis

Kurosaki · Aug 29, 2011
Saya mempunyai data di database (tbl_rute) seperti berikut:
________________________
| ID | Kd_Try | Rute |
|
|
| 01 | Try001 | rute A |
| 02 | Try002 | rute B |
| 03 | Try003 | rute C |
| 04 | Try004 | rute D |
| 05 | Try005 | rute E |
Saya ingin memunculkan data secara otomatis...
saya mempunyai 3 textfield:
<table width="600" border="0">
<tr>
<th width="101" align="right">ID Rute: </th>
<td colspan="2"><input type="text" name="id"></td>
<td width="60">&nbsp;</td>
</tr>
<tr>
<td colspan="3">Kd Try: <input type="text" name="kd_try" size="30" readonly disabled></td>
</tr>
<tr>
<td colspan="3">Rute: <input type="text" name="rute" readonly disabled>
</td>
</tr>
</table>
Jika saya ketikkan 01 pada ID Rute, maka Kd_Try dan Rute akan muncul secara otomatis di textfield sesuai dgn nama textfield.
Bagaimana ya caranya buat agar otomatis muncul?
mohon bantuannya...
terima kasih...
Silahkan login untuk menjawab!
1
Ellyx Christian · Sep 2, 2011 · 1 Suka · 0 Tidak Suka
cara yang bagus adalah menggunakan jQueryui autocomplete. Pertama buat file json.php yang berguna untuk mencari data dan membuat json
<?php
//file json.php
$conn = mysql_connect("localhost","user","password");
mysql_select_db("dbname");
$sql = "select * from tbl_rute where id like '%".$_GET['term']."%'";
$rs = mysql_query($sql,$conn);
$data  = array();
while($data = mysql_fetch_array($rs)){
	$data[] = array(
		'value' => $data['ID'],
		'label' => $data['ID'],
		'kd_try' => $data['Kd_Try'],
		'rute' => $data['Rute']
	);
}
header("Content-Type: 	application/json");
echo json_encode($data);
dan kemudian ubah kode kamu menjadi seperti:
<table width="600" border="0">
<tr>
<th width="101" align="right">ID Rute: </th>
<td colspan="2"><input type="text" name="id" id="id"></td>
<td width="60">&nbsp;</td>
</tr>
<tr>
<td colspan="3">Kd Try: <input type="text" name="kd_try" id="kd_try" size="30" readonly></td>
</tr>
<tr>
<td colspan="3">Rute: <input type="text" name="rute" id="rute" readonly>
</td>
</tr>
</table>
<!-- menambahkan jquery dan jqueryui-->
<link type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/themes/smoothness/jquery-ui.css" rel="stylesheet"/>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js"></script>
<script type="text/javascript">
$(function(){
	$("#id").autocomplete({
		source:'json.php',
		select:function( event, ui ){
			$("#kd_try").val(ui.item.kd_try);
			$("#rute").val(ui.item.rute);
			$("#id").val(ui.item.value);
			}
		});
	});
</script>
0
Frezen · Aug 28, 2012 · 0 Suka · 0 Tidak Suka
Di saya autocompletenya kok engak muncul ya mas gambarnya seperti ini
0
Ellyx Christian · Sep 2, 2012 · 0 Suka · 0 Tidak Suka
@Frezen: apa format json-nya sudah benar? coba lihat hasil response-nya di firebug