The Curious Guy The Curious Guy - 9 months ago 81
jQuery Question

How to maintain noConflict and include 2 versions of jQuery in Bootstrap 3.2

I'm modifying the UI of an old project which uses Flexigrid and Bootstrap 3.2. Flexigrid depends on jQuery 1.4.1 and Bootstrap 3 requires jQuery 1.9.0 or higher.

I tried using the older version of jQuery with Bootstrap but it breaks; likewise I tried using the newer version with Flexigrid.. it breaks.

I'm wondering if I can include both versions and force Bootstrap to use jQuery.noConflict somehow?


Since we had a lot of js code which relied upon jQuery 1.4.1, I did this:

Added both versions of jQuery to the page (1.4.1 and 1.9.1) in the following order:

<script src="/js/jquery-1.9.1.js"></script>
<script src="/js/bootstrap.js"></script>

var $jQuery1_9 = jQuery.noConflict(true);

<script src="/js/jquery-1.4.1.js"></script>
<!-- Include other js files here -->

Now, everything works fine (so far!). You may also find this post useful.


As far as I understand TB jQuery is already included, you need to make a reference for flexigrid library in other way.

<!-- load jQuery Flexigrid library -->
<script type="text/javascript" src="//path to flexigrid library"></script>
<script type="text/javascript">
    var $jQuery_flexgrid = $.noConflict(true);

Then you can use jQuery_flexgrid variable to fire jQuery functions and $ (dollar) sign for TB jQuery.