#4411 rails.js on body.observe('submit',...) but submit doesn't bubble in IE - Ruby on Rails

Type	To find
responsible:me	tickets assigned to you
tagged:"@high"	tickets tagged @high
milestone:next	tickets in the upcoming milestone
state:invalid	tickets with the state invalid
created:"last week"	tickets created last week
sort:number, importance, updated	tickets sorted by #, importance or updated
Combine keywords for powerful searching.
Use advanced searching »

This project is archived and is in readonly mode.

#4411 ✓resolved

rails.js on body.observe('submit',...) but submit doesn't bubble in IE

Reported by Bob Lail | April 16th, 2010 @ 03:32 AM | in 3.0.2

In Rails 3, rails.js handles click and submit events to allow links and forms to be submitted remotely while gracefully degrading on browsers with JS disabled. Unfortunately, the submit event doesn't bubble in IE. The following code assumes a function named submit_handler and attaches it to the forms' submit events when the forms receive focus.

if(Prototype.Browser.IE) {
  $(document.body).observe("focusin", function(event) {
    var form = event.findElement("form");
    if(form && !form.submit_bubbles_on_ie) {
      form.submit_bubbles_on_ie = true;
      form.observe("submit", submit_handler);
    }
  });
}

Comments and changes to this ticket

You flagged this item as spam.
Bob Lail April 17th, 2010 @ 03:11 PM
Fixed a syntax error in the previous patch.
- rails_js_submit_in_ie_fix.patch 2.7 KB
You flagged this item as spam.
Mislav April 23rd, 2010 @ 06:03 PM
- Tag changed from “rails3 prototype ie submit todo patch event bubble” to “bubble, event, ie, patch, prototype, rails3, submit, unobtrusive”
Hey,

This is an interesting solution, but it's too brittle. What about forms that don't have any inputs? In Rails, there could be forms that do a simple PUT or DELETE with a push of a single button, so they don't have inputs. Or did you find in your testing that form submit buttons get the "focusin" event right before the "submit" event?
You flagged this item as spam.
Bob Lail April 23rd, 2010 @ 07:20 PM
Mislav,

I'm pretty sure one of my tests was with a button_to --- and 'focusin' was fired before 'click' and 'submit'. But I'll double-check. I'll post back in a few days.

Bob
You flagged this item as spam.
Mislav April 23rd, 2010 @ 08:29 PM
In the meantime I've started a discussion on Prototype-core mailing list; we might get it into v1.7 and then ship it with Rails 3, making workarounds in here unnecessary.
You flagged this item as spam.
Bob Lail April 30th, 2010 @ 02:58 AM
Sorry for the delay --- I finally got some free time to double-check --- the solution does work for a form containing nothing but a button in IE8 and in IE8 running "IE7 mode". I'll have to hunt for a machine that still has IE6 on it.

It does make more sense for this fix to go into Prototype. Will Prototype 1.7 ship around the same time as Rails 3?
You flagged this item as spam.
Mislav April 30th, 2010 @ 04:06 AM
We hope so. Here's my plugin for 1.7 that I've proposed for inclusion
You flagged this item as spam.
Trent Lloyd June 8th, 2010 @ 06:22 PM
Mislav,

Can you clarify how to test that plugin? I tried to test if it works in my application, using 1.7 and loading that js file after prototype without any luck.. sorry if I don't quite understand how to use it. Just want to confirm if this fix works as I ran into this problem.

Thanks
josh June 8th, 2010 @ 09:03 PM
- Milestone cleared.
- State changed from “new” to “open”
You flagged this item as spam.
Mislav June 9th, 2010 @ 12:55 AM
Trent: simply loading that file after Prototype should work, yeah. The caveat is, it only changes the behavior of Element#on, not observe. This will work:
```
document.on('submit', 'form#myform.fancy', function(e) { ... })
```
This will not, because observe still uses the plain native "submit" event which doesn't bubble in IE:
```
document.observe('submit', function(e) { ... })
```
Jeremy Kemper June 27th, 2010 @ 08:54 PM
- Milestone cleared.
- Importance changed from “” to “High”
You flagged this item as spam.
Mislav June 27th, 2010 @ 10:17 PM
- Assigned user set to “josh”
Just to indicate, work on this is being done in the "prototype-ujs" repo and I expect Josh Peek will merge this in core when he's satisfied with the script. It already contains the bubbling fix for IE.
Repository June 28th, 2010 @ 12:42 AM
- State changed from “open” to “resolved”
(from [f61d923d284062b4e4864d81c603157020198d06]) Update to latest rails.js

[#4411 state:resolved] http://github.com/rails/rails/commit/f61d923d284062b4e4864d81c60315...
Jeremy Kemper October 15th, 2010 @ 11:01 PM
- Milestone set to “3.0.2”
[bulk edit]