Saya mencoba menambahkan fungsionalitas kloning untuk kotak pilihan. Saya memiliki 3 kotak pilih: negara, negara bagian, kota dan pengguna pertama memilih negara dan berdasarkan id kotak pilih negara bagian diisi dengan opsi dan sama dengan dropdown kota hanya akan terisi ketika negara bagian dipilih.
Kemudian saya menambahkan lebih banyak opsi di mana saya telah membuat ulang semuanya. jadi saya mengkloning div saya tetapi masalahnya ketika saya mengubah negara saya alih-alih menampilkan dropdown negara bagian baru, ia kembali ke drop down sebelumnya:
$('.country').on('change',function(){
var id = $(this).val();
callAjax(id);
});
$('.state').on('change',function(){
var id = $(this).val();
callAjax(id);
});
$('#btClone').on('click', function () {
$('#country')
.clone()
.attr('id', 'country_' + i)
.attr('name', 'country_' + i)
.appendTo("#container2");
$('#state')
.clone()
.attr('id', 'state_' + i)
.attr('name', 'state_' + i)
.appendTo("#container2");
i =i+1;
});
Html saya terlihat seperti
<div id="container1">
<select id="country" name="country" class="hidden country">
</select>
<select id="state" name="state" class="hidden state">
</select>
<select id="city" name="city" class="hidden city">
</select>
<span id="selected-profile"></span>
<div id="addons" class="hidden">
<input type="button" id="btClone" value="Clone the list" style="float:right;" />
</div>
</div>
<div id="container2" style="display:none;"></div>
Saya ingin ketika saya mengklik tambahkan baru lalu pilih negara lalu ubah sesuatu, panggil ajax saya lagi, tetapi sampai sekarang saya tidak dapat melakukan itu karena saya sudah punya opsi
