Cara Mengambil Value Dari Select Option Jquery

Posted by Admin on October 08, 2019

Kali ini saya akan membuat tutorial tentang bagaimana cara mengambil sebuah value dari event select option onChange JavaScript. Dalam Hal ini saya mempunya halaman Html seperti beriktu ini.

<div class="form-group clearfix">
    <label class="control-label " for="confirm">Divisi *</label>
    <div class="">
        <select name="divisi_id">
            <option value="1">IT</option>
            <option value="2">Keuangan</option>
            <option value="3">Inventory</option>
            <option value="4">Purchase</option>
        </select>
    </div>
</div>

Nah kita akan mengambil value/isi ketika pilih IT maka yang keluar adalah value 1 begitupun ketika pilih Keuangan makan value yang didapat adalah 2. Untuk itu kita harus menambahkan fungsi JQuery dengan codingan seperti berikut ini :

<script>
    $(function(){
        $('select[name=divisi_id]').on('change', function(){
            var divisiId = $(this). children("option:selected"). val();
            alert(divisiId)
        });
    });
})
</script>

Nah itu apabila kita onchange pada event tersebut namun apabila kita mau mengambil valu tapi di event yang lain namun pengen ngambil value divisiID karena buat keperluan Validasi misalkan maka kita cukup membuat syntak tambahan namun fullnya menjadi seperti ini.

<script>
    $(function(){
        $('select[name=divisi_id]').on('change', function(){
            var divisiId = $(this). children("option:selected"). val();
            alert(divisiId)
        });
    });

    $('select[name=jenis_transaksi]').on('change', function(){
        var divisiId = $("select[name=divisi_id] option:selected").val();
        alert(divisiId)
    });
})
</script>

Eventnya ketika kita select di option name jenis transaksi namun kita mau ngambil value divisiId, begitulah penjelasan singkat cara mengambil value pada select option javascript.

 

Terimakasih