Conflicts with Scriptaculous and jQuery

rubyonrails-talk
1

Hi all,

I have this rails website that works fine, but I wanted to experiment with jQuery a little so I added all the necessary file to my JavaScript folder and, well, all hell broke lose in that adding jQuery causes Scriptaculous/Prototype not to work while jQuery works kinda-fine. Doing a search on Google and even here, the overwhelming majority of people suggested the solution of using jQuery.noConflict(); to relinquish control of the $ variable back to Prototype. However, after struggling with this for almost a full day I can say with 100% certainty that this is not the cause of my problem.

I also tried:

(function($) {     $(document).ready(function(){         .....     }); })(jQuery);

with no luck. I get no JavaScript errors, but what I do get is a line under my text_boxes, which use auto_complete, which usually only happens when I have multiple tags with the same id on the same page, but I know for a fact that is not the problem here.

So I am really at a loss, just wondering if anybody has had this same issue and how did they fix it? I'm using Rails 2.3.4 and jQuery 1.5.2. Thanks,

-S

2

I fixed it. Here was the problem.

In my JavaScript include lines I had this:

<%= javascript_include_tag :defaults, 'scriptaculous', 'prototype', 'effects', 'controls', 'date-picker', 'jquery', 'jquery.min', 'application' %>

<script>    // Don't take this out as long as you are using the jQuery and    Scriptacous    libraries together. They don't play well together.    var $j = jQuery.noConflict(); </script>

And I changed it to this:

<%= javascript_include_tag 'jquery', 'jquery.min' %>

<script>    // Don't take this out as long as you are using the jQuery and    Scriptacous    libraries together. They don't play well together.    var $j = jQuery.noConflict(); </script>

<%= javascript_include_tag :defaults, 'scriptaculous', 'prototype', 'effects', 'controls', 'date-picker', 'application' %>

Apparently the relinquishing of this all import variable $ must be done after I include the necessary jQuery script files but before I include the Sciptaculous/Prototype script files.

Hopefully this helps someone.

-S

3

This could be written more neatly as

javascript_include_tag :defaults, :date-picker

:defaults loads the entire Prototype/Scriptaculous stack, plus application.js.

Walter