I've ran into a strange bug in Ruby on Rails. I'm attempting to implement the Uploadify JQuery library to handle multiple uploads using a flash object. I'm implementing this functionality on a tab that is loaded with Ajax. Previously I had my javascript_include_tag for my Uploadify js files on the same ajax page as the pertinent HTML affected by Uploadify. However, this produced some very odd results. Sometimes the calls to my Uploadify functions on that page would work, and other times it would fail completely. If in the case it didn't work by switching between tabs and retrieving the Ajax page a second or third time it usually fixed the problem. Oddly enough if I inspected the HTML with Firebug the javascript link was nowhere to be seen even when the Javascript functionality was working, though I did see the network request for the file. I tried moving the javascript_include_tag for uploadify to the head tag in my application layout but then Uploadify flatout ceased to work completely.
When I pushed the uploadify functionality with the link tag on the Ajax page to my production server the problem was still present, but a lot less frequent. In fact I only noticed it a few times. Also this functionality ceases to work on any other browser period, just Firefox, but that might be a completely different issue that I'll I have figure out (even though Javascript should be browser independent....).
Here's what my head tag looked like when I tried to include the uploadify call in it:
%head
%title Virtual Robot Games
= stylesheet_link_tag 'style.css','web_app_theme.css', 'events.css', :media => 'screen'
= csrf_meta_tag
= javascript_include_tag 'jquery'
= javascript_include_tag 'prototype'
= javascript_include_tag 'noconflict.js'
= javascript_include_tag 'effects.js'
= javascript_include_tag 'calendar_date_select'
= javascript_include_tag 'highlight'
= javascript_include_tag 'textcounter'
= javascript_include_tag 'scriptaculous.js'
= javascript_include_tag 'collapsible.js'
= javascript_include_tag 'bbhelp.js'
= javascript_include_tag 'swfobject'
= javascript_include_tag 'application'
= javascript_include_tag 'uploadify'
Extra info:
I'm using both Prototype and JQuery and they're constantly conflicting with one-another, but I'm usually able to work around this. I've never had any scenarious where the two libraries were conflicting and I've had JQuery that only sometimes work. Usually if there's a conflict it flat out won't work at all.
EDIT Actually I think I figured out the problem, I'm using the jquery-rails gem and I forgot to include the JQuery library in my Uploadify js file. Instead I had an inline link to googleapi. Replacing the google api link with the includes calls fixed the problem. Though my original question stands, should my JavaScript links all be stored in my head tag?
"Though my original question stands, should my JavaScript links all be stored in my head tag?"
javascript_include_tag is just a helper which generates <script></script> element in the html markup. So you can add it for instance before end of the </body> or anywhere in the page. You can also use it in partials. The other common practice is to use content_for in templates/partials and in your layout the associated label for example in <head> section. The purpose of it is to load only relevant js, when only one part of the site is very JavaScript intensive (perhaps charts/graphics/reports etc.) and the other site modules do not use that js libraries at all (but all modules share common layout).
So to sum it up, placement of javascript_include_tag depends more on the JavaScript execution rules on the html page than anything else. Use it as <script></script> element.