So I have Select code like this:
<select name="id_service" id="wagan" class="form-control" required="">
<option selected="" disabled="" value="">-Pilih Cok-</option>
<option value="1" data-yuyu="1" data-service="Berlangganan" selected="">Berlangganan</option>
<option value="2" data-yuyu="2" data-service="One Time Charge">One Time Charge</option>
<option value="3" data-yuyu="3" data-service="Bandwith On Demand">Bandwith On Demand</option>
</select>
There are 3 data item options, and they have values 1, 2 and 3. And I attached a Listener to that element with this code:
$('#wagan').change(function(){
var dayu = $('#wagan option:selected').attr('data-yuyu');
if (dayu == '1'){
// Do something when the value is 1
}else if(dayu == '2'){
// Do something when the value is 2
}else if(dayu == '3'){
// Do something when the value is 3
};
});
If the user chooses and commits the change by his own action, .change can work.
But if I set it earlier using:
$("#wagan").val("2").change(function(){
// Do something after value is set to value 2
}
It doesn't work.
I've read in the Jquery source, that:
Note: Changing the value of an input element using JavaScript, using .val() for example, won't fire the event.
How to get it done?
How do I set the value first and run the onChange function also?
Thanks for any help