-
-
Save EtienneLem/5569441 to your computer and use it in GitHub Desktop.
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <meta charset="utf-8"> | |
| <title>Modular DOMReady</title> | |
| </head> | |
| <body> | |
| <header></header> | |
| <section role="main"> | |
| <%= yield %> | |
| </section> | |
| <footer></footer> | |
| <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script> | |
| <%= yield :bottom_body_js %> | |
| </body> | |
| </html> |
| <h1>Partial or view</h1> | |
| <div class="interactive-module"> | |
| </div> | |
| <% content_for :bottom_body_js do %> | |
| <script>$(document).trigger('interactive-module:rendered')</script> | |
| <% end %> |
Please don't ever do this. Copying my comment from http://heliom.ca/blog/posts/modular-domready#comment-958215193:
"This is a bad, bad idea. Forgive me for being blunt, but you're coupling two things that shouldn't be coupled at all. You wouldn't put your CSS in style tags inside each partial, so why would you put JavaScript in there?
With this method, your JavaScript is tightly coupled to your HTML. So what if you end up wanting to use it somewhere else without the HTML? You'll end up including a bunch of partials that create a bunch of globals just so everything can access everything else. Plus, this encourages you to write DOM logic mixed in with your application logic, and—even worse—Ruby code that generates JavaScript dynamically. As someone who just transitioned a major web application from code that looked like this, let me tell you firsthand: what you're suggesting is a maintenance nightmare.
Instead, consider modularizing your JavaScript with a library such as RequireJS (http://requirejs.org/) and decoupling your DOM logic and application logic with something like Backbone (http://backbonejs.org/)."
Outputted HTML would be: