Ilmu Dasar PHP, JQuery, HTML, AJAX Dll: Dua combobox saling berhubungan

ketemu lagi dah saat ini saya ingin berbagi ilmu sedikit saya ini yaitu cara membuat 2 combobox agar dapat saling berhubungan sedikit ribet sih gmana caranya bisa menjodohkan combobox ... heheh mustahal,, bukan itu maksud ku tapi bagaimana agar saat combobox pertama belum dipilih maka combobox kedua tidak dapat dilihat isinya gmana menarikkan buat nya mudah-mudah gampang .. eh salah susah" mudah. deh whahahaha

langsung ke TKP aja ya gan, biasa sebelum kita ke script kita siapin dulu database dan tablenya dulu ok ini script

create database test;
use test;
create table propinsi(id_propinsi int(5) auto_increment,nama_propinsi varchar(20),primary key(id_propinsi));
insert into propinsi(nama_propinsi) values ('DKI_Jakarta');
insert into propinsi(nama_propinsi) values ('Jawa Barat');
insert into propinsi(nama_propinsi) values ('Jawa Tengah');

oh iya sampe lupa kitakan akan membuat dua comobox yang saling berhubungan jadi kita butuh dua table jadi masing" combobox memiliki table yang berbeda tapi saling berhubungan buat agan yang belum mengerti tentang relasi table di sql nga usah pusing nanti seiring seringnya agan baca di blog ini pasti akan memahami tentang relasi table di mysql ok gan jangan berkecil hati ya.. terus maju gan.. ok langsung ke TKP

table ke 2

create table kabupaten(id_propinsi int(5),id_kabupaten int(5) auto_increment,nama_kabupaten varchar(20), primary key(id_kabupaten,id_propinsi));
insert into kabupaten(id_propinsi,nama_kabupaten) values ('1','Jakarta Barat');
insert into kabupaten(id_propinsi,nama_kabupaten) values ('1','Jakarta Selatan');
insert into kabupaten(id_propinsi,nama_kabupaten) values ('1','Jakarta Utara');
insert into kabupaten(id_propinsi,nama_kabupaten) values ('1','Jakarta Pusat');
insert into kabupaten(id_propinsi,nama_kabupaten) values ('1','Jakarta Timur');
insert into kabupaten(id_propinsi,nama_kabupaten) values ('2','Bandung');
insert into kabupaten(id_propinsi,nama_kabupaten) values ('2','Garut');
insert into kabupaten(id_propinsi,nama_kabupaten) values ('2','Sumedang');
insert into kabupaten(id_propinsi,nama_kabupaten) values ('3','Semarang');
insert into kabupaten(id_propinsi,nama_kabupaten) values ('3','Surakarta');
insert into kabupaten(id_propinsi,nama_kabupaten) values ('3','Magelang');
insert into kabupaten(id_propinsi,nama_kabupaten) values ('3','Demak');

cukup kiranya ya.. biasa banyak" buat apa kan kita nga lagi belajar geografi heheheh becanda .. lanjut ke TKP...

combobox.php
<html>
<head>
<script src="jquery-1.4.js"></script>
<script>
$(document).ready(function(){
$("#propinsi").change(function(){
var propinsi = $('#propinsi').val();
$.ajax({
   url: "proses_kota.php",
   data: "propinsi=" + propinsi,
success: function(data){
                   //jika data sukses diambil dari server tampilkan de <select id=kota>
   $('#kota').html(data);
                }
        });
     });
});
</script>
</head>
<body>
Propinsi :
<select name="propinsi" id="propinsi">
<option>--pilih Propinsi--</option>
          <?php
   mysql_connect("localhost","root","");
   mysql_select_db("test");

// tampilkan nama-nama propinsi yang ada di database
   $query = mysql_query("select * from propinsi order by nama_propinsi");

   while($p=mysql_fetch_array($query)){
echo "<option value='".$p['id_propinsi']."'>".$p['nama_propinsi']."</option>\n";
                 }
          ?>
   </select><br/>

Kota:
<select name="kota" id="kota">
   <option>--Pilih Kota--</option>
</select>
</body>
</html>

selesai sudah file pertama yang kita buat sekarang kita lanjut ke file prosesnya aja ok berangkat gan ke file kedua TKP..

proses_kota.php
<?php
mysql_connect("localhost","root","");
mysql_select_db("test");

$propinsi = $_GET["propinsi"];

$query = mysql_query("select * from kabupaten where id_propinsi='$propinsi'");

echo "<option>-- Pilih Kota--</option>";
while($row = mysql_fetch_array($query)){
echo "<option value=".$row['id_kabupaten'].">".$row['nama_kabupaten']."</option>\n";
}
?>

sudah deh selesai mudahkan cepat klo ada yang error seperti biasa silahkan komen di posting jadi saya tau dimana error nya semoga bisa membantu CHAYooooo

Ilmu Dasar PHP, JQuery, HTML, AJAX Dll

Selasa, 18 September 2012

Dua combobox saling berhubungan

Tidak ada komentar:

Posting Komentar