mobile logo

jQuery onChange only running once

Solution:

If 1st time select working and 2nd time not then need to reset value of select on mouseenter event like in my snippet code.

Don’t need to write document ready statement For both static and dynamic select changes.
Something like this.

jQuery(document).on(‘change’, ‘select’, function (e) {
// do something
});

I hope below snippet will help you a lot.

function myFunc(getvalue) {
    var complex_name = getvalue;
    if (complex_name == 'eldogleneast') {
        jQuery("#billing_suburb").val('ELD');
        jQuery('#billing_postcode').val('0157');
    } else if (complex_name == 'Reldoglen') {
        jQuery("#billing_suburb").val('LPN');
        jQuery('#billing_postcode').val('0133');
    } else if (complex_name == 'eldin') {
        jQuery("#billing_suburb").val('STK');
        jQuery('#billing_postcode').val('2147');
        jQuery("#billing_complex_address").val('Lion St');
    } else if (complex_name == 'elm') {
        jQuery("#billing_suburb").val('ELD');
        jQuery('#billing_postcode').val('0147');
        jQuery("#billing_complex_address").val('Lor Ave');
    }
}
jQuery(document).on('change', '#billing_complex_name', function () {
    var getname = jQuery('#billing_complex_name').val();
    jQuery("#billing_suburb, #billing_postcode, #billing_complex_address").val('')// first reset
    myFunc(getname);
});

jQuery(document).on('mouseenter', '#billing_complex_name', function () {
    $(this).val(''); // need to reset after change 
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select id="billing_complex_name">
    <option value="" selected>---</option>
    <option value="eldogleneast">eldogleneast</option>
    <option value="Reldoglen">Reldoglen</option>
    <option value="eldin">eldin</option>
    <option value="elm">elm</option>
</select>
<br><br>
<label>Suburb</label><br>
<input type="text" id="billing_suburb">
<br><br>
<label>Post Code</label><br>
<input type="text" id="billing_postcode">
<br><br>
<label>Address</label><br>
<input type="text" id="billing_complex_address">