jquery untuk mengisi beberapa daftar dropdown dari database

Cara Anda baik-baik saja - tetapi akan membutuhkan banyak panggilan ajax untuk membawa nilai opsi untuk semua bidang yang dipilih. Anda dapat mencapai ini dalam satu panggilan ajax menggunakan JSON. Di halaman PHP, Anda dapat membuat array yang akan berisi string HTML yang mewakili opsi untuk empat kotak pilih. Kemudian Anda dapat mengonversi larik ini menjadi string JSON menggunakan fungsi json_encode():

$arr=array("second"=>"<option>....</option>.......<option...</option>", //for second dropdown
           "third"=>"<option>....</option>.......<option...</option>", //for third dropdown
           "fourth"=>"<option>....</option>.......<option...</option>", //for fourth dropdown
           "fifth"=>"<option>....</option>.......<option...</option>" //for fifth dropdown
  );
 echo json_encode($arr);

Kemudian pada halaman web, untuk dropdown pertama, Anda dapat menulis fungsi jQuery seperti ini:

 function loadOptions(){
jQuery.ajax({

  success: function(data){
     jQuery("select#field_2").html(data["second"]);
     jQuery("select#field_3").html(data["third"]);
     jQuery("select#field_4").html(data["fourth"]);
     jQuery("select#field_5").html(data["fifth"]);
  }
});
}

Dengan cara ini, Anda dapat memuat opsi untuk semua dropdown lainnya dalam satu panggilan ajax. Saya mengerti bahwa Anda memerlukan fungsi serupa untuk dropdown lain juga. Anda juga dapat menulis fungsi serupa untuk dropdown lain. Berikut adalah fungsi umum, di mana Anda memberikan nomor dropdown dan fungsi tersebut akan mengembalikan opsi untuk dropdown yang ditargetkan. Misalnya, jika Anda melewati dropdown nomor 2, fungsi akan mengembalikan opsi untuk dropdown 3, 4 dan 5. Jika Anda melewati 3, itu akan mengembalikan opsi untuk dropdown 4 dan 5, dan seterusnya.

 function loadOptions(selectNo){
jQuery.ajax({
  data:{"selectNo",selectNo},
  success: function(data){
     switch(selectNo){
     case 1: jQuery("select#field_2").html(data["second"]);
     case 2: jQuery("select#field_3").html(data["third"]);
     case 3: jQuery("select#field_4").html(data["fourth"]);
     case 4: jQuery("select#field_5").html(data["fifth"]);
     }
  }
});
}

Pada halaman PHP, Anda dapat menulis kode di bawah ini untuk mengimplementasikan fungsi ini:

$selectNo=$_GET["selectNo"];
$arr=array();
switch(selectNo){
case 1: $arr["second"]="<option>....</option>.......<option...</option>"; //for second dropdown
case 2: $arr["third"]="<option>....</option>.......<option...</option>"; //for third dropdown
case 3: $arr["fourth"]="<option>....</option>.......<option...</option>"; //for fourth dropdown
case 4: $arr["fifth"="<option>....</option>.......<option...</option>"; //for fifth dropdown
}
 echo json_encode($arr);

Informasi lebih lanjut tentang JSON dapat ditemukan di sini .