onChange event not firing when input changed dynamically

Question

On my form, I have a DropDown, when a value is selected, I fire some JavaScript that populates some visible <input type="text" /> fields (under neath the drop down).

The problem is, I also want to run some JavaScript function whenever the value of one of these inputs changes, I want this function to run even if the text input is changed by the drop down selection.

Here is my current code:

jQuery(document).ready(function() {
    $('#mainPane').on('change', '#formElementFromEmail', function(event){
        var collectFromDropDown = $('#formElementFromEmail');
        persistHiddenInputForCollectFromValue();
    });
});

I suspect the change event is not being fired because no one has manually changed the value of the field in question. How can I overcome this?

Answer 1

由于您使用的是jQuery，因此可以触发事件：

$('#mainPane').trigger('change');

Answer 2

you can simulate change event by

var element = document.getElementById('formElementFromEmail');
element.onchange();