Howdy, Stranger!

It looks like you're new here. If you want to get involved, click one of these buttons!

Try Vanilla Forums Cloud product

Ready to contribute?

Amazing! Sign our contributors' agreement and then join us on GitHub.

Running newer version of jquery (1.9+ compatability layer).

x00x00 MVP
edited May 2014 in Tutorials

Don't run a different version of jquery unless you absolutely have to.

There was a step change i njquery between after 1.9, and the jquery team decided not to provide backwards compatibility for some things.

However they provided a compatibility script.

https://github.com/jquery/jquery-migrate/

grab copy of this

http://code.jquery.com/jquery-migrate-1.2.1.min.js

put it a file say jquery_capability.js

You need a fix for UI so append this to the file.

//jQuery UI fix
$.curCSS = function (element, attrib, val) {
    $(element).css(attrib, val);
};

Make sure this script is loaded immediately after jquery.

grep is your friend.

UnderDogperegrine

Comments

  • vrijvlindervrijvlinder Papillon-Sauvage MVP

    What about using jQuery.noConflict()

    https://api.jquery.com/jQuery.noConflict/

    I thought that helped with the loading libraries of different versions ...

    I do know that running multiple versions can break things like cleditor and emotify.

    UnderDog
  • x00x00 MVP
    edited May 2014

    Not related. This is to do with old method of jquery not being in 1.9.

    jquery decided to remove a lot of the bloat, rather then carry every depreciated method. So they can streamline jquery.

    noConflict is to do with other js libraries that use $ in the global scope.

    You should never use $ in the global scope anyway, it bad style.

    generally speaking jquery should be self contained.

    jQuery(document).ready(function($){//jQuery object assigned to $
    // $ not global
    $('body').css('background','red');
    });
    
    jQuery(document).ready(function(_){//jQuery object assigned to _
    // _ not global
    _('body').css('background','red');
    });
    

    You should not really need noConflict these days. Unless $ is deliberately exposed.

    grep is your friend.

    vrijvlinderdeathbeamUnderDogperegrine
  • Btw never load two version of jquery, it really bad practice, and silly.

    grep is your friend.

  • here is an example of how to load these files using themehooks, assume you create a file called class.customthemehooks.php

    <?php if (!defined('APPLICATION')) exit();
    class CustomThemeHooks extends Gdn_Plugin{
    
        public function Base_Render_Before($Sender){
            //remove core jquery
            $Sender->RemoveJsFile('jquery.js');
    
            //root relative location of theme
            $ThemeLoc = CombinePaths(array(Gdn::Request()->WebRoot(), 'themes', $Sender->Theme));
    
            //add new jquery
            $Sender->Head->AddScript($ThemeLoc.'/js/jquery.js');
            //compatibility with older jquery
            $Sender->Head->AddScript($ThemeLoc.'/js/compatibility.js');
        }
    }
    

    You probably want to use a more unique name for you class name and file name.

    grep is your friend.

    UnderDoghgtonight
  • deathbeamdeathbeam New
    edited June 2014

    @x00 said:
    Not related. This is to do with old method of jquery not being in 1.9.

    jquery decided to remove a lot of the bloat, rather then carry every depreciated method. So they can streamline jquery.

    noConflict is to do with other js libraries that use $ in the global scope.

    You should never use $ in the global scope anyway, it bad style.

    generally speaking jquery should be self contained.

    jQuery(document).ready(function($){//jQuery object assigned to $
    // $ not global
    $('body').css('background','red');
    });
    
    jQuery(document).ready(function(_){//jQuery object assigned to _
    // _ not global
    _('body').css('background','red');
    });
    

    You should not really need noConflict these days. Unless $ is deliberately exposed.

    Finally someone normal :smile: I was using noConflict when I was trying to get Bootstrap working with Prototype (becouse of MyBB is using prototype still...). And I totally agree that using 2 diff jQuery versions at once is totally stupid, it is like you will have on PC IE 8 and IE 9, on one running Facebook and on other one Twitter and switching between them with ALT-TAB. And no, I am not IE lover, it is just worst example that came to my mind :smiley:. Nice tut for newbies.

  • @x00 thank you so much for your posts here. You saved be an incredible amount of time.

Sign In or Register to comment.