In Times Of Crisis…
Spent a whole evening last night trying to get the Mootools Rails 3 UJS driver working correctly. Links created in templates were recognised as having “data-remote” attributes as rails.js applies events on domready but dynamically created links (created in the js.erb template returned from the remote call) weren’t even though i was calling rails.applyEvents( element ). Was starting to feel like I was losing my mind. I’d read the docs… and read the docs again… and then again but to no avail. Ready for sleeps I called it quits and went to bed feeling a little grumpy.
So this morning i set about debugging it with a fresh head. I got out my debugging toolkit (kindly
supplied drilled into me by Pete at Offroad Code) and set about figuring out what was wrong.
I created a fresh Rails app, copied over Mootools and the rails.js driver file and changed the js default. I created one controller with two empty methods (index and remote_method) and created a view for each (index.html.erb and remote_method.js.erb). In the index view I created a link with with remote set to true and an empty div (update-me). In remote_method.js.erb I added a line to update the div with some text and a link (the link also has data-remote set to true) and added a call to rails.applyEvents( link ).
I loaded the page and clicked the link. Hey presto the div is updated with text and a link. I then click the dynamically created link and…. it ignores the fact i have data-remote set to true and heads off to the href set for the link.
Not ready to be defeated, I headed back to remote_method.js.erb to see if there’s anything that I’ve missed. And it’s then that it pops into my head. What if it’s not the link that I need to applyEvents? Back to the docs I go.
It turns out I’d misread the docs and should have been passing the container to applyEvents not link as i was doing. It seems so bleeding obvious now i’ve re-read the docs. DOH!
Time to revert my non remote solution and crack on 🙂