StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

POWorkaround for IE's Non-Bubbly Submit Events
text
Body
copied!<p>I'm working on a large web application with a lot of AJAX whose event handling has gotten out of control. I'm trying to set up an <a href="http://icant.co.uk/sandbox/eventdelegation/" rel="nofollow noreferrer">event delegation</a> system to manage all of it, but am wondering if there's a workaround for IE's non-bubbling form submits (there are a lot of forms that get inserted/updated via AJAX). The best thing I've come up with is executing a bit of javascript to reload submit handlers every time I get a response from an AJAX call, but this seems ugly. Any ideas?</p> <p>Also, does anyone have a good reference for which events don't correctly propagate in different versions of IE? I've had trouble finding good information (though <a href="https://stackoverflow.com/questions/265074/does-the-onchange-event-propagate">this other question</a> has a bit).</p> <hr> <p>A real example from the site: there is in-place editing of some user content. Doing event delegation, I would have the body listen for submit events and then see what element triggered the event and handle it accordingly. Since submits don't bubble in IE, this won't work. The $5 solution would be to do event delegation for all other events and handle submits using something like this in Prototype:</p> <pre><code>// call this onload: $$('form').invoke('observe', 'submit', function(event) { /*delegate*/ }); </code></pre> <p>But this won't work for forms that are created dynamically (I'd have to re-instantiate the handler every time as mentioned above), and the whole thing would just be nicer if I could "make" form submits bubble in IE and just do plain delegation everywhere (no special cases, etc).</p>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload