Skip to main content

Bug Tracker

Side navigation

#5313 closed bug (invalid)

Opened September 30, 2009 08:38PM UTC

Closed October 01, 2009 12:13AM UTC

In IE 7/8, the "change" event does not fire when a form element is changed.

Reported by: edelgadom Owned by:
Priority: major Milestone: 1.4
Component: event Version: 1.3.2
Keywords: Cc:
Blocked by: Blocking:


Given this form:

    <form action="" method="get" accept-charset="utf-8">
        <select name="some_name">
            <option value="option1">option1</option>
            <option value="option2">option2</option>

And this div:

    <div id="log"></div>

The following code works as expected in Safari 4.0.3 and Firefox 3.5.3, but does not in IE 7 or 8:

    $("#log").append("<p>The form has changed</p>");

Seems like in IE, the change event is not propagated or bubbled up to the form element; therefore the code inside the change event block does not get executed.

The same behavior is present using this style of event binding:

  $("form").bind("change", function(e){ ... });

It is only when you change your selector to:

  $("form :input").change(function(){ ... });

That the change event is detected by IE. Of course, the issue with this, is that only those static input elements will be bound to these event listener. Any generated form elements will need to be bound again (so not using event bubbling anymore).

I was expecting the selector to behave the same in IE as in Firefox and Safari. I'm attaching an example. Use it on IE and Firefox please.

Thanks in advance,


Attachments (1)
Change History (1)

Changed October 01, 2009 12:13AM UTC by dmethvin comment:1

component: unfilledevent
resolution: → invalid
status: newclosed

Since there is no change event on the form itself, you are anticipating that IE will bubble the change events fired by the elements it contains. The problem is that IE does not bubble the change event, contrary to what the W3C spec says. Listen for change events on the form elements directly.