How to get jQuery to work with Prototype
- by thinkfuture
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!