0

I want to create a select option box after the user chooses the select option before.

the first select option variable is printed by php. my this code

<ul class="dropdown-menu dropdown-select SysReportParent">';

$num = 0;
$q = json_decode(SysTragedyParent::ReadAll($db_config),true);
$HitungData = sizeof($q['result']['data']);

while ($HitungData > $num) {
    $data .= '<li value="'.$q['result']['data'][$num]['id_sys_tragedy_parent'].'"><a href="#">'.$q['result']['data'][$num]['nama_kejadian'].'</a></li>';
$num++;
                                        }
</ul>

After That I Call Ajax To call data from the first select option like this code

/** Fungsi Untuk Mencari Data Tragedy Parent Yang Ada Di Buat Laporan Data Untuk Melakukan Pencarian kategori Child ***/
$('ul.SysReportParent li').click(function () {

    //console.log($(this).attr('value'));
    $.ajax({
        url: 'https://' + window.location.hostname + '/Api',
        cache: false,
        type: 'POST',
        dataType: 'json',
        data: {
            'sys_tragedy_child': true,
            'id_sys_report_parent': $(this).attr('value')
        },
        success:function (result) {
            $('.childTragedyReport li').remove();
            var num = 0;
            var hitungChildTragedy = result.result.data.length;
            while (hitungChildTragedy > num ){
                $('.childTragedyReport').append('<li value="'+ result.result.data[num].id_sys_tragedy_child +'"><a href="#">'+ result.result.data[num].nama_kejadian +'</a></li>');
                num++;
            }

        },
        error:function (result) {
            $.toast({
                heading: 'Pengambilan Gagal', // Menampilkan Judul Notifikasi
                text: 'Data Kategori Tidak Ditemukan', // Menampilkan Text Notifikasi
                position: 'top-right', // Berada pada Posisi kanan Atas
                loaderBg:'#1d32ff', // background Warna Loading
                icon: 'error', // Icon Indicator Jika Berhasil dilakukan Aksi Program
                hideAfter: 5500, // Menghapus Pesan Jika Sudah Muncul Di Lakukan Data System
                stack: 6
            });
        }

    });

});

everything goes Normal. However when I want to click on select the second option. select option cannot select the selected item

My Picture

Barmar
  • 741,623
  • 53
  • 500
  • 612
Yovangga Anandhika Hadi Putra
  • 3
  • 4
  • This: `$('ul.SysReportParent li').click(` adds event listeners to existing elements. When you create new elements, they don't get the listeners. Try `$(window).on('click', 'ul.SysReportParent li', function() ...` – Tibrogargan Jan 24 '18 at 21:18
  • the command is already running and gets a response from ajax callback. the problem is when the element in the `append` can not be clicked See the picture above – Yovangga Anandhika Hadi Putra Jan 24 '18 at 21:25
  • It's unclear what you're asking. "Cannot select the selected item" makes no sense. – Tibrogargan Jan 24 '18 at 21:36

0 Answers0