Programmatically manipulating DOM element value doesn't fire onchange event

Question

I\'ve got a hidden form field, and when a button gets pressed the value of the hidden field is changed. Now, I\'ve added an observer to the hidden field, listening for changes t

Answer 1

I don't think input elements that are hidden respond to that event.

I don't know prototype, but I think the events being triggered is entirely up to the browser.

Here is an example with jQuery on JSbin. Notice that changing the text yourself fires the event, however the next part of code that changes the value via script does not fire it.

Answer 2

You need event.simulate.js

Fire the event..

button.observe('click', function(event) {
  hiddenField.setValue(someValue);
  hiddenField.simulate('change');
});

And then observe it:

hiddenField.observe('change', function(event) {
  alert('It works!');
});