Whenever I am calling markicons() function for opening the google map it is showing Uncaught TypeError: .dialog is not a function.I am not getting where is the error.Please help me.I am trying from last 3 hours but not getting any solution.
<link href="../PurpleStyle/css/style.css" rel="stylesheet" />
<script src="../assets/js/jquery-2.0.3.min.js"></script>
<script src="../assets/js/jquery-ui-1.10.3.full.min.js"></script>
<link href="../assets/css/jquery-ui-1.10.3.full.min.css" rel="stylesheet" />
<script type="text/javascript" src=";sensor=false"></script>
<script src="../PurpleStyle/js/jquery.js" type="text/javascript"></script>
<script type="text/javascript">
var map = null; var infowindow;
function InitializeMap() {
debugger;
var latlng = new google.maps.LatLng(0.0, 0.0);
if (!map) {
var myOptions = {
zoom: 14,
center: latlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
map = new google.maps.Map(document.getElementById('map'), myOptions);
}
else {
map.setCenter(latlng);
}
}
function markicons(listString) {
debugger;
InitializeMap();
var locations = [];
var ltlng = listString.split('~');
for (var i = 0; i < ltlng.length; i++) {
var loc = ltlng[i].split(",")
var lat = parseFloat(loc[0])
var lng = parseFloat(loc[1])
locations.push(new google.maps.LatLng(lat, lng));
}
debugger;
map.setCenter(locations[0]);
for (var i = 0; i < locations.length; i++) {
marker = new google.maps.Marker({
map: map,
position: locations[i]
});
(function (i, marker) {
google.maps.event.addListener(marker, 'click', function () {
if (!infowindow) {
infowindow = new google.maps.InfoWindow();
}
infowindow.setContent("Message" + i);
infowindow.open(map, marker);
});
})(i, marker);
}
var dil = $("#map").dialog({
autoOpen: false,
minHeight: 500,
minWidth: 600,
height: 500,
width: 600,
closeOnEscape: true,
modal: true,
buttons: {
"CLOSE": function () {
$(this).dialog("close");
//$("#map").style.display = "none";
}
}
});
dil.dialog('open');
}
</script>
Whenever I am calling markicons() function for opening the google map it is showing Uncaught TypeError: .dialog is not a function.I am not getting where is the error.Please help me.I am trying from last 3 hours but not getting any solution.
<link href="../PurpleStyle/css/style.css" rel="stylesheet" />
<script src="../assets/js/jquery-2.0.3.min.js"></script>
<script src="../assets/js/jquery-ui-1.10.3.full.min.js"></script>
<link href="../assets/css/jquery-ui-1.10.3.full.min.css" rel="stylesheet" />
<script type="text/javascript" src="http://maps.googleapis./maps/api/js?libraries=geometry&sensor=false"></script>
<script src="../PurpleStyle/js/jquery.js" type="text/javascript"></script>
<script type="text/javascript">
var map = null; var infowindow;
function InitializeMap() {
debugger;
var latlng = new google.maps.LatLng(0.0, 0.0);
if (!map) {
var myOptions = {
zoom: 14,
center: latlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
map = new google.maps.Map(document.getElementById('map'), myOptions);
}
else {
map.setCenter(latlng);
}
}
function markicons(listString) {
debugger;
InitializeMap();
var locations = [];
var ltlng = listString.split('~');
for (var i = 0; i < ltlng.length; i++) {
var loc = ltlng[i].split(",")
var lat = parseFloat(loc[0])
var lng = parseFloat(loc[1])
locations.push(new google.maps.LatLng(lat, lng));
}
debugger;
map.setCenter(locations[0]);
for (var i = 0; i < locations.length; i++) {
marker = new google.maps.Marker({
map: map,
position: locations[i]
});
(function (i, marker) {
google.maps.event.addListener(marker, 'click', function () {
if (!infowindow) {
infowindow = new google.maps.InfoWindow();
}
infowindow.setContent("Message" + i);
infowindow.open(map, marker);
});
})(i, marker);
}
var dil = $("#map").dialog({
autoOpen: false,
minHeight: 500,
minWidth: 600,
height: 500,
width: 600,
closeOnEscape: true,
modal: true,
buttons: {
"CLOSE": function () {
$(this).dialog("close");
//$("#map").style.display = "none";
}
}
});
dil.dialog('open');
}
</script>
-
1
I'm assuming you've included the jQuery UI files for
dialog()? jqueryui./dialog – Griffith Commented Oct 23, 2015 at 13:56 - Yes I have Used that for dialog() @Griffith – Mind Stalker Commented Oct 23, 2015 at 14:00
-
Check that
$is referring to jQuery – A. Wolff Commented Oct 23, 2015 at 14:02 -
In which instance does the error occur? When calling
dil.dialog('open')? – Griffith Commented Oct 23, 2015 at 14:07 -
You're loading two copies of
jQuery:../assets/js/jquery-2.0.3.min.jsand../PurpleStyle/js/jquery.js– Barmar Commented Oct 23, 2015 at 14:19
1 Answer
Reset to default 4The problem is that you're loading jQuery twice:
<script src="../assets/js/jquery-2.0.3.min.js"></script>
<script src="../PurpleStyle/js/jquery.js" type="text/javascript"></script>
When jQuery-UI is loaded, it uses the first version of jQuery. But when your script runs, it's after the second version of jQuery is loaded. So its $ variable refers to the second jQuery definition, but jQuery-UI updated the first jQuery definition.
If you really need to load two versions of jQuery, you'll need to use jQuery.noConflict() to resolve which version you use when.