Seperti yang Anda katakan Anda tidak memiliki pengalaman dengan jQuery atau Ajax, saya akan memposting jawaban saya dengan komentar sebanyak mungkin. Saya akan berasumsi bahwa Anda memiliki dua pilihan dropdown di halaman Anda.
Yang pertama berisi pembangun, sehingga akan memiliki id="builders" .
Yang kedua berisi wilayah, sehingga akan memiliki id="regions" .
Dari apa yang saya pahami, pilihan pertama akan persis seperti yang Anda posting di pertanyaan Anda, yang dihasilkan sisi server (oleh PHP). Saya hanya meminta Anda untuk membuat sedikit perubahan padanya, membuat setiap nilai opsi sama dengan ID basis data pembuat, dan bukan namanya (kecuali kunci utama pembuat adalah nama mereka, dan bukan ID). Ini tidak akan membuat perbedaan bagi pengguna akhir tetapi akan menjadi penting untuk solusi jQuery kami. Yang kedua akan kosong, karena idenya adalah untuk mengisinya secara dinamis dengan region yang terkait dengan builder yang dipilih di dropdown pertama.
Sekarang mari kita ke kode jQuery:
//Everything that goes below this first line will be ready as soon as the page is fully loaded
$(document).ready(function() {
//The following code defines an event. More precisely, we are defining that the code inside it will run every time our select with id "builders" has its value changed
$('#builders').change(function() {
//$(this) is our builders select. $(this).val() contains the selected value, which is the ID of our selected builder
var currentValue = $(this).val();
//Now, this is our Ajax command that will invoke a script called get_regions.php, which will receive the builder's ID in $_GET['builder_id'] and you can use to query your database looking for all regions related to this builder. Make sure to create an array with the returned regions. Your get_regions.php's last line should be echo json_encode($regions);
$.get("get_regions.php", {'builder_id': currentValue}, function(data) {
//Inside this function is the code that will run when we receive the response from our PHP script. It contains a JSON encoded list of regions, so first of all we need to parse this JSON
var regions = $.parseJSON(data);
//Before filling our second select dropdown with the regions, let's remove all options it already contains, if any
$('#regions').empty();
//Now, all there is left is to loop over the regions, adding each as an option of the regions dropdown. I'll do it the universal way
for (var i = 0; i < regions.length; i++) {
var regionOption = '<option value="'+regions[i]['region_name']+'">';
regionOption += regions[i]['region_name'];
regionOption += '</option>';
$('#regions').append(regionOption);
}
});
});
});
Meskipun ada kesalahan sintaks (tidak dapat menguji kode dari sini), ini harus berhasil. Semoga komentarnya cukup jelas bagi Anda untuk memahami cara kerja di jQuery.
