Search code examples
javascriptjqueryjavascript-frameworkjquery-eventsmapmyindia-api

Jquery library conflict with another jQuery library


I am using a lot of jQuery libraries in my application.

My application is based on a map, and the map is generated by my own server mapmyindia.com.

The problem is that there is a jQuery conflict that occurs when I use fancybox jQuery library, pagination jQuery library and drop-down checklist jQuery library, all work together.

My direction search API's don't work because of a jQuery library conflict.

However, if I remove all the jQuery libraries, I can use my direction search API just fine.

With the jQuery libraries enabled, it gives me an error:

$.jsonp is not a function

My application is on app.mapmyindia.com/michelin please help me.......

<script>MIREO_RESOURCES_ROOT = "http://46.137.254.191/MapServer/";</script>
<script type="text/javascript" src="http://46.137.254.191/MapServer/MireoWebMap.js"></script>

<script type="text/javascript">
    var map = $("#map");
    var valid = new Validation();
    map.MireoMap();
</script>


<script type="text/javascript" src="jquery/jquery-1.6.1.min.js"></script>
<script type="text/javascript" src="jquery/jquery-ui-1.8.13.custom.min.js"></script>
<script type="text/javascript" src="jquery/ui.dropdownchecklist-1.4-min.js"></script>
<script type="text/javascript" src="fancybox/jquery.fancybox.js?v=2.0.6"></script>
<link rel="stylesheet" type="text/css" href="fancybox/jquery.fancybox.css?v=2.0.6" media="screen"/>

Solution

  • try this :

    use jquery noconflict and wrap your code in jQuery functions :

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

    jQuery.noConflict();
    jQuery(function($){
      // my code here each 
    });
    

    good luck.