JQuery listens for changes in input field after ajax background load

Question

I have two jQuery functions, the first of which performs ajax loading, depending on how users drop out, select options, and then change the input field based on the return value. It works great.

//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 for changes in the above input field, and if the value in the input field is 0, it should disable all input fields in the form. The jquery on change function does not seem to detect changes through ajax in the input field. Any help is 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 problem is that programmatically changing the value of input elements does not raise an event. To get the required behavior, you can trigger() event manually:

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