Loop form select option with ajax

saya memiliki 2 form select option yang diulang di looping sebnyak keinginan user, dimana option pada select option kedua akan berdasarkan pada data yang dipilih pada select option yang pertama. ini link contoh tampilannya <a href='https://drive.google.com/file/d/1pu0QKIhcBbAz-x3X7t9HlYGg_ziiKh07/view?usp=sharing'>https://drive.google.com/file/d/1pu0QKIhcBbAz-x3X7t9HlYGg_ziiKh07/view?usp=sharing</a> pada contoh diatas form di loop sebnyak 2 kali

ini sintax form html saya


<table>
  <form>
<?php
 for($i=1;$i<=$jml;$i++){?>
   <tr>
   <td>Jenis CI</td>
   <td><select class="form-control" name="jenis2[]"id="jenis2[]" required>
       <?php foreach($relasi as $row) { ?>
       <option value="<?php echo $row->idJenisCI;?>"><?php echo $row->namaJenisCI;?>
       </option><?php } ?>
       </select>
   </td>
   </tr>
   <tr>
   <td>Nama CI</td>
   <td><select  class="id2 form-control" name="id2[]" required></select></td>
   </tr>
<?php }?>
   <tr align="center">
   <td colspan="2"><input class="tombol" type="submit" name="submit" value="Simpan"></td>
   </tr>

 </form>
</table>

lalu ini sintax javascript dan ajax saya

<script type="text/javascript">
    $(document).ready(function(){
        $('#jenis2').change(function(){
            var idJenisCI=$(this).val();
            $.ajax({
                url : "<?php echo base_url();?>index.php/C_ProyekAkhir/option",
                method : "POST",
                data : {idJenisCI: idJenisCI},
                async : false,
                dataType : 'json',
                success: function(data){
                    var html = '';
                    var i;
                    for(i=0; i<data.length; i++){
                        html += '<option value="'+data[i].idCI+'-'+data[i].namaCI+'">'+data[i].namaCI+'</option>';
                    }
                    $('.id2').html(html);

                }
            });
        });
    });
 </script>

jadi karena di looping variabel pada select option menjadi array, saya bingung bagaimana cara mengambil data array tersebut dan di masukkan pada ajax untuk mengisi option pada select option kedua untuk berdasarkan pada setiap select option pertama.

avatar ashleenanh46
@ashleenanh46

21 Kontribusi 5 Poin

Diperbarui 5 tahun yang lalu

1 Jawaban:

coba pake ini gan <a href='http://api.jquery.com/jquery.each/'>http://api.jquery.com/jquery.each/</a>

avatar driyan
@driyan

193 Kontribusi 109 Poin

Dipost 5 tahun yang lalu

Tanggapan

ada yg lainnya gk, soalnya gk membantu

Login untuk ikut Jawaban