Ruby on rails3 where to put javascript code

Question

I'm pretty much a novice to the world of Ruby on Rails, a few weeks back I followed Lynda's good ruby on rails guide so I kinda know how to set up a project etc. Anyway, I made an website in html/css but wanted to do it in rails after all so I went to work. I love how you can just "dump" files in folders and rails just picks them out but I also had a few lines of javascript code on my site to "activate" the jquery following. It was in my header

<script type="text/javascript" id="sourcecode">
    $(function(){

    $('.scroll-pane').jScrollPane({
    showArrows: false,
    autoReinitialise: true
        });

});
</script>

So the simple question now is, where do I put this code since rails doesn't really have an .

Jordan · Accepted Answer · 2011-07-20 20:19:47Z

1

Check out this page for layout and rendering: http://guides.rubyonrails.org/layouts_and_rendering.html

There is a section there about rendering your ERB templates. You need to put your javascript code in your .erb template, within the head, just like you would in a normal HTML page.

To be clear, you can save the contents of your script tag into a .js file and link to it in your template, just like you would in plain HTML.

edited Jul 20, 2011 at 20:19

answered Jul 20, 2011 at 15:08

Jordan

32.7k6 gold badges59 silver badges67 bronze badges

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

Comments

WattsInABox · Accepted Answer · 2011-08-12 15:00:40Z

1

You can place your JS:

in the erb template it deals with
under public/javscripts in a normal .js file that you can include in templates using the javascript_include_tag helper
in seperate .js.erb template files for ajaxian / manual include purposes

EDITED, per suggestion:

Personally, I'd choose one of the last 2 since those are more Convention over Configuration, or the "Rails" way, which is what I believe you're looking for.

edited Aug 12, 2011 at 15:00

answered Jul 20, 2011 at 15:09

WattsInABox

4,6362 gold badges37 silver badges43 bronze badges

7 Comments

Jordan Over a year ago

Well, you may as well explain your last sentence. Voodoo programming comes out of statements like that.

alucardu Over a year ago

Well I tried putting the code in a "jquery_slider.js" file in the public/javascript folder but it does not seem to help. So I am going to try your first option, but like Jordan said I would like to know what's bad about it.

WattsInABox Over a year ago

See @Nick's response for the include tag that works as a test. But then change the include to <%= javascript_include_tag :name_of_js_file %>. The first choice I gave is bad because it's just like including javascript directly in HTML files. Combining HTML / javascript / css in the same file creates hard-to-manage projects.

Jordan Over a year ago

@dmf85: I understand where you're going now. Certainly you would want to link out to an external file if this is supposed to be reused. I don't see anything like that specified in point #1 (meaning, it could just be a <script src="...">), so I was curious why you wouldn't just do that. For me, I would combine your point #1 and #2 and say that's the correct way of linking an external script.

alucardu Over a year ago

I put the website up on Heroku so maybe you guys can take a look, morning-spring-991.heroku.com/home/index and this is the non rails site no-illusions.nl/keepmewaiting As you can see the non rails version has the blue scrollbar, all the js code is being loaded but it does not seem to work. I think it's because this code <script type="text/javascript" id="sourcecode"> $(function(){ $('.scroll-pane').jScrollPane({ showArrows: false, autoReinitialise: true }); }); </script type="text/javascript"> should be placed in the header instead of an JS file.

|

user483040 · Accepted Answer · 2011-07-20 16:06:13Z

0

I put all scripts in public/javascripts in a directory structure that mirrors controller/action names + a vendor directory and a common directory. In my application.html.* I have code to load what I need for the controller/action into the header. I make a strong effort to not put javascript into my .haml (.erb) files but am willing to break that rule if I must.

answered Jul 20, 2011 at 16:06

user483040

Comments

Nick Radford · Accepted Answer · 2011-07-20 18:09:45Z

0

I would put them in public/javascripts/ until Rails 3.1.

Also make sure you are including your javascripts in the template.

<% javascript_include_tag :all %>

answered Jul 20, 2011 at 18:09

Nick Radford

1,0486 silver badges13 bronze badges

2 Comments

alucardu Over a year ago

Doesn't Rails automatically put all the js files from that folder in the header?

Nick Radford Over a year ago

No. It will only if you add <% javascript_include_tag :all %> to the <head></head> block in the application template file.

user1724295 · Accepted Answer · 2014-02-19 05:23:29Z

0

For loading reasons, don't you want certain javascript snippets to be called after the template loads rather than in the beginning (ex: called in the header)?

answered Feb 19, 2014 at 5:23

user1724295

Collectives™ on Stack Overflow

Ruby on rails3 where to put javascript code

5 Answers 5

Comments

7 Comments

Comments

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

Comments

7 Comments

Comments

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related