[javascript] Call Javascript onchange event by programmatically changing textbox value

the problem I'm facing is this:

• I have a textbox for a date range along side a calendar control.
• When the user selects a date from the calendar, it fills that date into the textbox
• When this happens I want to fire a javascript function, however, the 'onchange' event doesn't seem to happen.

I'd ideally like to be able to add the event as an attribute to the textbox, something like:

txtCreateDate.Attributes.Add("onchange", string.Format("JSfunction({0},'{1}');", arg1, arg2));

more info: The date is entered into the textbox in c#. The calendar control has an eventhandler on the page. When a date is selected, the eventhandler puts the date into the textbox. I have tried setting the focus to the textbox at this point, then putting an onBlur attribute on the textbox, but the textbox never seems to get focus.

I suppose I could directly call the javascript function at this point doing ClientScript.RegisterClientScriptBlock or something like that, but that seems sloppy and never works like I want it to.

Onchange is only fired when user enters something by keyboard. A possible workarround could be to first focus the textfield and then change it.

But why not fetch the event when the user clicks on a date? There already must be some javascript.

You can fire the event simply with

document.getElementById("elementID").onchange();

I dont know if this doesnt work on some browsers, but it should work on FF 3 and IE 7+

You can put it in a different class and then call a function. This works when ajax refresh

$(document).on("change", ".inputQty", function(e) {

//Call a function(input,input);
});

You're population is from the server-side. Using the registerclientscript will put the script at the beginning of the form.. you'll want to use RegisterStartupScript(Block) to have the script placed at the end of the page in question.

The former tries to run the script before the text area exists in the dom, the latter will run the script after that element in the page is created.

This is an old question, and I'm not sure if it will help, but I've been able to programatically fire an event using:

if (document.createEvent && ctrl.dispatchEvent) {
    var evt = document.createEvent("HTMLEvents");
    evt.initEvent("change", true, true);
    ctrl.dispatchEvent(evt); // for DOM-compliant browsers
} else if (ctrl.fireEvent) {
    ctrl.fireEvent("onchange"); // for IE
}

You can try the Anthem library.

The "onchange" is only fired when the attribute is programmatically changed or when the user makes a change and then focuses away from the field.

Have you looked at using YUI's calendar object? I've coded up a solution that puts the yui calendar inside a yui panel and hides the panel until an associated image is clicked. I'm able to see changes from either.

http://developer.yahoo.com/yui/examples/calendar/formtxt.html