when you use jQuery and prototype javascript frameworks togather on the same page, it creates conflicts.
jQuery has provided a resolution to this conflict. The resolution goes as below:
Overriding the $-function:
1) you can override that default by calling jQuery.noConflict() at any point after jQuery and the other library have both loaded. For example:
<html>
<head>
<script src="prototype.js"></script>
<script src="jquery.js"></script>
<script>
jQuery.noConflict();
// Use jQuery via jQuery(...)
jQuery(document).ready(function(){
jQuery("div").hide();
});
// Use Prototype with $(...), etc.
$('someid').hide();
</script>
</head>
<body></body>
</html>
2) Additionally, there's another option. If you want to make sure that
jQuery won't conflict with another library - but you want the benefit
of a short name, you could do something like this:
<html>
<head>
<script src="prototype.js"></script>
<script src="jquery.js"></script>
<script>
var $j = jQuery.noConflict();
// Use jQuery via $j(...)
$j(document).ready(function(){
$j("div").hide();
});
// Use Prototype with $(...), etc.
$('someid').hide();
</script>
</head>
<body></body>
</html>
For more information on the above topic please refer to http://docs.jquery.com/Using_jQuery_with_Other_Libraries
March 15, 2009 at 6:36 pm
there was a time when i got this same problem but eventualy found. i posted my solution on this link: http://ahsangill.wordpress.com/2008/12/30/using-jquery-and-prototype-in-same-application/
but nice to know that ur problem was solved,
Ahsan Shahzad
July 9, 2009 at 4:45 pm
Hi I have a problem implementing lightbox 2 (that uses prototype.js) and Feature Content Gallery (that uses jQuery) in the same page. One excludes the other. I’m not really into js so if you can help me I would be very grateful.
Thanks in Advance
July 15, 2009 at 3:20 pm
hi filip,
didn’t the solution provided in this post helped you out?
if so can you please provide me with the exact error/problem you are getting.
September 19, 2009 at 11:41 pm
it didnt work for me
September 21, 2009 at 11:50 pm
can you please show me what exact error you are getting so that i can help you out
hey, sorry for late reply
January 13, 2010 at 5:14 pm
Hi sachin while searching stuff i came across your blog, c i am using jquery and i want to use the auto_complete_tag of symfony which gives a call to the prototype.js of symfony implicitly. both of these are getting clashed. and its saying $ is not defined. i have already used no conflict on the page where jquery is getting loaded.. Please suggest something..
Thanks in Advance
March 16, 2010 at 7:35 pm
its great working fine on my webside.
thanks lots
March 16, 2010 at 7:37 pm
Thanks a lot!!!
April 30, 2010 at 1:53 pm
you saved at the edge, very helpful, i solved the problem at teh last minute with your short name solution.
many thanks
May 29, 2010 at 2:19 am
Right now, you are a God to me.
Thank you!!!!!! this saved me!!
May 30, 2010 at 11:52 am
oh, man that are the greatest words of appreciation i have had till now, thanks
June 18, 2010 at 7:07 am
Hi. The solution we find here and in the jQuery website includes a statement that “hides” divs. This simply “hides” the content on my page. Is there a solution without having to hide divs?? Thanks
September 2, 2010 at 9:02 pm
[...] samsami2u Filed Under: Magento Snippets. Tagged With: Add new [...]
November 15, 2010 at 11:05 am
var xmlHttp
function loadContent()
{
$(“#Menu”).load(“menu.html”);
$(“#Clients”).load(“clientslist.html”);
}
November 15, 2010 at 11:07 am
I am using this jquery function in website..but this code have conflicting to other .
How to solve conflicting problem in this function ????????????????
————————
var xmlHttp
function loadContent()
{
$(“#Menu”).load(“menu.html”);
$(“#Clients”).load(“clientslist.html”);
}
December 1, 2010 at 7:38 pm
@samsami2u : I was struck with this issue for almost 3 days and you helped me save bread for the rest of ma life!!!
Three cheers to you friend.
February 24, 2011 at 10:59 pm
cheers
February 5, 2011 at 6:11 pm
[...] jquery.min.js & prototype.js and this result in a conflict. After googling around I found this page citing the same problem. Still no luck after trying the suggested solution [...]
March 4, 2011 at 1:57 am
Have two weeks on and off working on this issue. I attempted to above correction and have had no luck. I am using jquery-1.2.6.js. Is this a problem of itself? Looking for ANY help I can get so I my normal life will return.
March 4, 2011 at 8:27 am
can you send me the exact script/html page where you are finding this issue
June 15, 2011 at 12:15 pm
any idea about oscommers . I search a lot about the file format in oscommers and what are functionality for that. Please help me !!
June 20, 2011 at 9:14 pm
whats exactly the issue you are facing?
June 15, 2011 at 1:36 pm
jquery conflict with the other .js files.
June 20, 2011 at 9:16 pm
can you give some more details of the issue
July 29, 2011 at 2:08 pm
Excellent boss !…
Thnx alot…
September 1, 2011 at 12:06 am
beautiful!!
thank you very much ! =)
November 8, 2011 at 5:15 pm
Hello Samsami2u,
I am getting error when prototype.js & one other js both are in a same page.
What should be the solution?
Actually I am having a slider in a page that is using a js file named “all.js” & in that page drop-down menu is there.
pls. see http://eagle.arvixe.com/~houselav/index.php/gallery/chanel-gallery.html (In this page “Shop” menu is having a drop-down menu).
Now when including “all.js” file if I write jQuery.noConflict(); after including “all.js” then slider stops working & if I do not write no-conflict() after including “all.js” then drop-down menu stop coming.
Any solution?
Thanks.