dropdown action

templates/index.html

@@ -583,7 +583,7 @@
         }
 
         $('#provinsiDropdown').on('change', function (e) {
-           const kodeProvinsi = $(this).val();  // lebih aman daripada e.target.value
+           const kodeProvinsi = $(this).val();
             console.log("Provinsi dipilih:", kodeProvinsi);
 
             if (!kodeProvinsi) {
@@ -593,6 +593,29 @@
 
             localStorage.setItem('kode_provinsi', kodeProvinsi);
 
+            $('#kabkotaDropdown').empty().trigger('change');
+
+            // Ambil kabupaten berdasarkan provinsi
+            const kabkotaURL = "{{ url_for('main.get_master_kabkota') }}";
+            $.ajax({
+                url: kabkotaURL,
+                data: { provinsi_id: kodeProvinsi },
+                dataType: 'json',
+                success: function (data) {
+                    const results = data.map(kabupaten => ({
+                        id: kabupaten[0],
+                        text: kabupaten[1]
+                    }));
+
+                    // Tambahkan ke dropdown kabupaten
+                    $('#kabkotaDropdown').select2({
+                        data: results,
+                        placeholder: 'Pilih Kabupaten/Kota',
+                        allowClear: true
+                    });
+                }
+            });
+
             console.log(`Memuat kabupaten dari /geojson/kabupaten/${kodeProvinsi}`);
             loadLayer(`/geojson/kabupaten/${kodeProvinsi}`, () => {
                 console.log("Layer kabupaten dimuat.");
@@ -600,9 +623,36 @@
         });
 
         $('#kabkotaDropdown').on('change', function (e) {
-            const kodeKabupaten = e.target.value;
-            
+            const kodeKabupaten = $(this).val();
+            if (!kodeKabupaten) {
+                console.warn("Tidak ada kode provinsi yang dipilih!");
+                return;
+            }
             localStorage.setItem('kode_kabupatenkota', kodeKabupaten);
+
+            $('#kecamatanDropdown').empty().trigger('change');
+
+            // Ambil kabupaten berdasarkan provinsi
+            const kabkotaURL = "{{ url_for('main.get_master_kecamatan') }}";
+            $.ajax({
+                url: kabkotaURL,
+                data: { kabkota_id: kodeKabupaten },
+                dataType: 'json',
+                success: function (data) {
+                    const results = data.map(kecamatan => ({
+                        id: kecamatan[0],
+                        text: kecamatan[1]
+                    }));
+
+                    // Tambahkan ke dropdown kabupaten
+                    $('#kecamatanDropdown').select2({
+                        data: results,
+                        placeholder: 'Pilih Kabupaten/Kota',
+                        allowClear: true
+                    });
+                }
+            });
+
             loadLayer(`/geojson/kecamatan/${kodeKabupaten}`, () => {}, 'kecamatan');
         }).select2();
 
@@ -611,10 +661,66 @@
             localStorage.setItem('kode_kecamatan', kodeKecamatan);
             loadLayer(`/geojson/desa/${kodeKecamatan}`, () => {}, 'desa');
         });
+    </script>
 
+    
+    <script>
         $(document).ready(function () {
             console.log("ready for fetching data")
             const provinsiURL = "{{ url_for('main.get_master_provinsi') }}";
+            $('#kabkotaDropdown').empty().trigger('change');
+            $('#provinsiDropdown').select2({
+                placeholder: 'Pilih Provinsi',
+                allowClear: true,
+                ajax: {
+                    url: provinsiURL, 
+                    dataType: 'json',
+                    delay: 250, 
+                    data: function (params) {
+                        return {
+                            q: params.term 
+                        };
+                    },
+                    processResults: function (data) {
+                        console.log(data)
+                        return {
+                            results: data.map(provinsi => ({
+                                id: provinsi[0],        
+                                text: provinsi[1]       
+                            }))
+                        };
+                    },
+                    cache: true
+                },
+                minimumInputLength: 0
+            });
+
+            $('#kabkotaDropdown').select2({
+                placeholder: 'Pilih Kabkota',
+                allowClear: true,
+                ajax: {
+                    url: provinsiURL, 
+                    dataType: 'json',
+                    delay: 250, 
+                    data: function (params) {
+                        return {
+                            q: params.term 
+                        };
+                    },
+                    processResults: function (data) {
+                        console.log(data)
+                        return {
+                            results: data.map(provinsi => ({
+                                id: provinsi[0],        
+                                text: provinsi[1]       
+                            }))
+                        };
+                    },
+                    cache: true
+                },
+                minimumInputLength: 0
+            });
+
             $('#provinsiDropdown').select2({
                 placeholder: 'Pilih Desa',
                 allowClear: true,