prototype and jquery conflict-clash-compatibility issue


Yesterday we got major clash/compatibility issue or conflict😯 with jQuery and Prototype.
We were using javascript slider and menu with jQuery and some popup window with prototype window.

Searched a lot👿 , Then finally came up with 2 solution.

  1. Every one says change in jQuery, prototype doesnt have any thing like this.
  2. we got this link solving the conflict/clash/compatibility withing jQuery and Prototype
var $j = jQuery.noConflict();

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

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

So where ever you are getting “$” change this to “$j” or any variable what ever you like.

Really, jQuery is built is such at superb way, so this proves that this is fully dynamic.

What a solution sir ji, wah!! 3 cheers to jQuery guys.

Lession learnt : first see the requirment, dont just use any js library that suites your requirment. See the dependency then go ahead.😎

8 Comments

  1. Ahsan Shahzad
    Posted March 16, 2009 at 12:01 am | Permalink | Reply

    there was a time when i got this same problem and found the solution too. i posted the solution on my blog here: http://ahsangill.wordpress.com/2008/12/30/using-jquery-and-prototype-in-same-application/

    but nice to know that ur problem has solved,

    Ahsan Shahzad

  2. venkat
    Posted April 8, 2009 at 3:34 pm | Permalink | Reply

    Why did you have to use both JQ and prototype.js in the first place, couldn’t you have just use JQ? and Yeah JQ is awsome.

    • Posted April 8, 2009 at 11:19 pm | Permalink | Reply

      yea, you are right. But it was my mistake, I need to build something so we used Prototype but when it comes to implement the changes to live then we got to know that we have already jQuery for that project.
      So we need to look for patch.😦

  3. Chip
    Posted July 7, 2009 at 9:47 pm | Permalink | Reply

    So you just add that code to your javascript or to your html? Sorry, I’m trying to develop a website that uses prototype and jQuery. Once you add the script then you have to change all instances of $ into $j in your .js code?

    • Posted July 8, 2009 at 9:58 am | Permalink | Reply

      i have added these lines to .js file.

      See what happen, the prototype and jquery both use “$” so in jquery you can assign $ as $z and then replace all $ to $z.

      But this you need to change in jquery only, bcoz prototype wont support this thing.

      hope this will help you.

      happy progromming.🙂

  4. phpdesktop
    Posted December 28, 2009 at 11:29 pm | Permalink | Reply

    Good Article,

    http://phpdesktop.wordpress.com

  5. Abbas Dhuliawala
    Posted January 7, 2010 at 4:34 pm | Permalink | Reply

    this problem was detected, solved and FORGOTTEN, when i was in GMI… but thanks to Ankur who manages to find some time for people like me by writing these kinds of blogs…

  6. Posted September 5, 2011 at 9:35 am | Permalink | Reply

    I was struggling for several hours to make both prototype AND jQuery working. This solution seems to be the best of breed. All the prototype calls are unchanged and the jQuery calls work as well. Good work! I believe one can still call jQuery directly without the aliasing (e.g., jQuery). But with the aliasing the calls look more like jQuery.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: