How to get jQuery to work with Prototype

Posted by thinkfuture on Stack Overflow See other posts from Stack Overflow or by thinkfuture
Published on 2010-03-27T08:47:10Z Indexed on 2010/03/27 9:53 UTC
Read the original article Hit count: 395

Filed under:
|
|
|

Ok so here is the situation. Been pulling my hair out on this one.

I'm a noob at this. Only been using rails for about 6 weeks. I'm using the standard setup package, and my code leverages prototype helpers heavily. Like I said, noob ;)

So I'm trying to put in some jQuery effects, like PrettyPhoto. But what happens is that when the page is first loaded, PrettyPhoto works great. However, once someone uses a Prototype helper, like a link created with link_to_remote, Prettyphoto stops working.

I've tried jRails, all of the fixes proposed on the JQuery site to stop conflicts...

http://docs.jquery.com/Using_jQuery_with_Other_Libraries

...even done some crazy things likes renaming all of the $ in prototype.js to $$$ to no avail. Either the prototype helpers break, or jQuery breaks.

Seems nothing I do can get these to work together.

Any ideas?

Here is part of my application.html.erb

<%= javascript_include_tag 'application' %>
<%= javascript_include_tag 'tooltip' %>
<%= javascript_include_tag 'jquery' %>
<%= javascript_include_tag 'jquery-ui' %>
<%= javascript_include_tag "jquery.prettyPhoto" %>
<%= javascript_include_tag 'prototype' %>
<%= javascript_include_tag 'scriptalicious' %>
</head>
<body>
<script type="text/javascript" charset="utf-8">
  jQuery(document).ready(
    function() {
      jQuery("a[rel^='prettyPhoto']").prettyPhoto();
    });
</script>

If I put prototype before jquery, the prototype helpers don't work If I put the noconflict clause in, neither works.

Thanks in advance!

Chris

BTW: when I try this, from the jQuery site:

<script>
 jQuery.noConflict();

 // Use jQuery via jQuery(...)
 jQuery(document).ready(function(){
   jQuery("div").hide();
 });

 // Use Prototype with $(...), etc.
 $('someid').hide();
</script>

my page disappears!

© Stack Overflow or respective owner

Related posts about jQuery

Related posts about rails