Javascript Events: Getting notified of changes in an <input> control value

Question

I have the following problem:

I have an HTML textbox (<input type="text">) whose contents are modified by a script I cannot touch (it is my page, but i'm using external components).

I want to be notified in my script every time the value of that textbox changes, so I can react to it.

I've tried this:

txtStartDate.observe('change', function() { alert('change' +  txtStartDate.value) });

which (predictably) doesn't work. It only gets executed if I myself change the textbox value with the keyboard and then move the focus elsewhere, but it doesn't get executed if the script changes the value.

Is there another event I can listen to, that i'm not aware of?

I'm using the Prototype library, and in case it's relevant, the external component modifying the textbox value is Basic Date Picker (www.basicdatepicker.com)

Answer 1

As you've implied, change (and other events) only fire when the user takes some action. A script modifying things won't fire any events. Your only solution is to find some hook into the control that you can hook up to your listener.

Here is how I would do it:

basicDatePicker.selectDate = basicDatePicker.selectDate.wrap(function(orig,year,month,day,hide) {
  myListener(year,month,day);
  return orig(year,month,day,hide);
});

That's based on a cursory look with Firebug (I'm not familiar with the component). If there are other ways of selecting a date, then you'll need to wrap those methods as well.

Answer 2

addEventListener("DOMControlValueChanged" will fire when a control's value changes, even if it's by a script.

addEventListener("input" is a direct-user-initiated filtered version of DOMControlValueChanged.

Unfortunately, DOMControlValueChanged is only supported by Opera currently and input event support is broken in webkit. The input event also has various bugs in Firefox and Opera.

This stuff will probably be cleared up in HTML5 pretty soon, fwiw.

Update:

As of 9/8/2012, DOMControlValueChanged support has been dropped from Opera (because it was removed from HTML5) and 'input' event support is much better in browsers (including less bugs) now.