jquerydrop-down-menuonchangejquery-trigger

Fill Combo on change Trigger using JQuery


I have two DropDowns, on change event of one Drop Down, i haved filled the 2nd Drop Down. when i trigger the change event of first drop down on Arrow Keys, its not working, while on Mouse click its working fine. Here is my Code..

$('#cmbCategory').on('change', function () {
    //alert($(this).val());
    // the below function will get Sub Categories from DataBase.
    getSubCategories($('#cmbCategory :selected').val(), '');
}).keydown(function (e) {
    if (e.which == 37 || e.keyCode == 38 || e.keyCode == 39 || e.keyCode == 40) {
        $(this).trigger('change');
    }
});

This code works fine while using Mouse, but doesn't work on Arrow Keys. Any Help..


Solution

  • I think you have to add keyup event or you can also use keypress event

    $("#cmbCategory").keyup(function(e) 
    {
            if (e.keyCode == 40) 
            {  
                getSubCategories($('#cmbCategory :selected').val(), '');
            }
            if(e.keyCode==38)
            {
                getSubCategories($('#cmbCategory :selected').val(), '');
            }
    
    });
    

    Note: Above code is not tested