Following is the Code of Google Map:
Google Map
var myAddress = new google.maps.LatLng(24.466807, 54.384297);
function initialize() {
var mapOptions = {
center: myAddress,
zoom: 15,
minZoom: 15,
mapTypeId: google.maps.MapTypeId.ROADMAP,
panControl: true,
scaleControl: true,
streetViewControl: true,
};
var map = new google.maps.Map(document.getElementById("googleMap"), mapOptions);
var marker = new google.maps.Marker({
position: myAddress,
animation: google.maps.Animation.BOUNCE,
});
marker.setMap(map);
var infowindow = new google.maps.InfoWindow({
content: "Abu Dhabi International Quality Consultancy
Head Office"
Head Office"
});
infowindow.open(map, marker);
}
google.maps.event.addDomListener(window, 'load', initialize);
I put the above Code in a PartialView Page and its name is DisplayMap.cshtml. I want to display this partial view inside my index view page using the following code:
function DisplaySearchedMap() {
var selectedValue = $("#cmbSearchCriteria :selected").text();
$.ajax({
url: "/Maps/DisplayMap",
type: "GET",
success: function (response) {
$("#ContentsArea").html(response);
},
error: function (response) {
alert("Cannot Load Map " + response.responseText);
}
});
}
Using the above code the google map div is displayed but the google map does not display. I checked the above PartialView separately its working perfectly. When i display the PartialView page that is DisplayMap.cshtml using its url then its working but it cannot display inside the Index page using the above code. Please help me what i missed in the above code.
3 Replies
Know the answer? Post it — somebody with the same question will find it here.
Sign in to answer this question
It is the same account you read, post and publish with — and you will come straight back to this page.

Mario ScheerenPosted Mar 21, 2019, 8:28 AM
Adalat KhanPosted Mar 21, 2019, 7:15 AM
Mario ScheerenPosted Mar 21, 2019, 7:12 AM
public ActionResult GetDisplayMap(int index = 0)
{
return PartialView("DisplayMap", new DisplayMapModel());
}