Add DateInputBox onChange event handler

Feb 22, 2008 at 10:48 AM
Edited Feb 22, 2008 at 10:49 AM
I can't seem to find anything that talks about client side scripting support, particularly with the DateInputBox. Using JavaScript I want to trigger an event handler once the data has changed by the user. I've added a onchange event handler to the textbox but when the date is changed from the calendar image button ie the user selects a date from the calendar dialog the event handler doesn’t trigger. Can anyone offer advise about where I’m going wrong or is there a way to extend the date input so that custom javascript can be called (for example when a user selects a date from the dialog)?

Many thanks
Coordinator
Feb 27, 2008 at 1:47 PM
Hi

The event handling we use is the approach used in ASP.NET AJAX - see here http://www.asp.net/AJAX/Documentation/Live/tutorials/DefiningBindableClientComponent.aspx for reference. Basically setting properties raises 'raisePropertyChanged' events, which can be handled in your code.

If you take a look at http://www.mscui.net/Samples/DateTime/DateTimeSampleComplex.aspx you will see an example of handling events from the DateInputBox (you can also run this page locally on your dev box as part of the sample site giving you better access to the source). Basically there is a function to handle any property changes:

function onPropertyChange(sender, args)
{
dateLabel.innerHTML = dateInput.get_value();
}

which is registered as a handler in the page_load like this:

dateInput.add_propertyChanged(onPropertyChange);

which is the standard way of doing this in ASP.NET AJAX.

If you look at the source you will see that this gets triggered in a number of situations. And to answer your question, changing the date using the calendar will trigger this handler. It will also fire when the date is updated using the keyboard, but only when the control loses focus. This is by design as we don't want it to fire before editing is complete.

Hope this helps.

Regards, Jim