Jquery listen to changes on input field after a background ajax load

Question

I have two Jquery functions here, the first one performs an ajax load depending on users drop down select options, then changes an input field based on value returned. This works fine.

//perform a background ajax load and get the allocation available if any
$("#ministry").change(function(){
    var ministry=$("#ministry").val();
    var url="/VoteBook/ministry.php?mini="+ministry;
    $.get(url, function(data,status){
        $(".alloc").val(data);
    })
});

Then the second function should listen to changes on the input field specified above, and if the value in the input field is 0, it should disable all input fields in the form. It seems, the 'jquery on change' function doesn't detect the changes via ajax on the input field. Any help is highly appreciated.

//disable all inputs on allocation field change

$(".alloc").change(function(){
    var allocation=$(".alloc").val();
    if(allocation==0){
        $("#add_vote_form :input").attr('disabled', true);
    }
});

Answer 1

The issue is that programmatically changing an input elements value doesn't raise an event. To get the behaviour you require, you can trigger() the event manually:

$.get(url, function(data,status){
    $(".alloc").val(data).trigger('change');
})