How do I include page-specific JavaScript?

Question

In my Rails app, every page includes all of the JavaScripts in assets.

Some custom scripts are for Ajax and some fancy stuff. which run unnecessarily from every page and are causing me unnecessary overload.

For example, the session page doesn't really need any JavaScript at all, still all scripts are included. How do I change this? I have Rails 3.2.2.

<script src="/assets/jquery-1.7.2.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.ui.core.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.ui.widget.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.ui.position.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.ui.autocomplete.js?body=1" type="text/javascript"></script>
<script src="/assets/special.js?body=1" type="text/javascript"></script>

If your web server is properly returning caching headers for your scripts, note that it doesn't hurt to have them 'loaded' for pages that don't need them. Indeed, most of my sites use a single minified JavaScript file included on every page of the site, and that JavaScript file conditionally executes code based on which page it is on. — Phrogz
– Phrogz, Commented May 18, 2012 at 16:43
We have published a gem that resolves this issue, check the blog post eng.wolox.com.ar/blog/2013/04/19/introducing-loadjs — GuidoMB
– GuidoMB, Commented Apr 25, 2013 at 18:19

Sergio Tulentsev · Accepted Answer · 2012-05-18 16:41:16Z

8

I use content_for.

application.html.erb

<head>
  <%= yield :custom_js %>
</head>

your_page.html.erb

<% content_for :custom_js do %>
   <!-- your script includes go here -->
<% end %>

answered May 18, 2012 at 16:41

Sergio Tulentsev

231k43 gold badges381 silver badges373 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Majoris Over a year ago

Tried that. Seems like my pages are including all scripts in the asset folder, even though I took them out from application.js. all scripts are loaded.

Sergio Tulentsev Over a year ago

Look for require_tree in the application.js, this is what is loading them.

the Tin Man · Accepted Answer · 2012-05-18 17:02:44Z

2

Don't put the <script> elements in your layout, put them on the page(s) you need. Alternatively, have your layout conditionally include them based on logic set in your controller.

edited May 18, 2012 at 17:02

the Tin Man

161k44 gold badges222 silver badges308 bronze badges

answered May 18, 2012 at 16:41

Phrogz

304k114 gold badges669 silver badges758 bronze badges

Collectives™ on Stack Overflow

How do I include page-specific JavaScript?

2 Answers 2

application.html.erb

your_page.html.erb

2 Comments

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

application.html.erb

your_page.html.erb

2 Comments

Comments

Linked

Related