How to search location on google maps [duplicate] - asp.net-mvc

Question

This question already has answers here:
Using Address Instead Of Longitude And Latitude With Google Maps API
(5 answers)
Closed 7 years ago.
I have data in database like this:
Database table
Name : Jack
mob_number : 445452454
address : al saada street
country : dubai
In my view
#item.Name
#item.address
#item.country
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript">
function initialize() {
var latlng = new google.maps.LatLng(40.716948, -74.003563);
var options = {
zoom: 14,
center: latlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(document.getElementById("map"), options);
}
initialize();
</script>
How do I pass #item.address to google maps for search location ?
http://prntscr.com/8a6m4r click to view
MY view:
#if (Model != null)
{
if (Model.Count() != 0)
{
<div class="">
#foreach (var item in Model)
{
<div class="tiptext">
<b style="margin-left: 0px; font-size: large;color: #1A0DB2;">#item.BusinessName</b>
<h3 style="margin: 5px 0px 5px 0px;color: rgb(0, 145, 0);"> #item.FirstName</h3>
<h3 style="margin: 8px; color:black">#item.BusinessCategory </h3>
<div class="description">
<div class="description_image">
<img src="~/Images/popup_pointer.jpg" />
<div class="POP_UP_outer">
<div class="description_background">
<div class="description_map">
<b>Map</b>
</div><hr />
<div class="description_body">
<b>Description </b><h4 class="des">#item.BusinessDescription</h4>
<b>Address2 </b><h4 class="des">#item.Address1</h4>
<b>Email </b><h4 style="color:blue; margin: 5px 0px 5px 0px;">#item.EmailID </h4>
<b>WorkNumber </b><h4 class="des">#item.WorkNumber</h4>
<b>MobileNumber </b><h4 class="des">#item.MobileNumber</h4>
<b>City </b><h4 class="des">#item.City</h4>
<b>State </b><h4 class="des">#item.State</h4>
<b>ZipCode </b><h4 class="des">#item.ZipCode</h4>
#Html.ActionLink("Book An Appointment", "CalendarView", "Appt", new { id = #item.UserID }, null)
#*#Html.ActionLink("Book An Appointment", "Popup", "Search", new { #class = "openDialog", data_dialog_id = "aboutlDialog", data_dialog_title = "Additinal Customer" })*#
</div>
</div>
</div>
</div>
</div>
</div>
}
</div>
}
else
{
<label id="lblErrorMsg" title="Record not fount...!" style="color:red;">Record not found...!</label>
}
Hover script
<script type="text/javascript">
$(".tiptext").mouseover(function () {
$(this).children(".description").show();
}).mouseout(function () {
$(this).children(".description").hide();
});
</script>
u can see map on my view i want to load map there

Answer 1

You need to use it like this it work for me
function initialize() {
// Change the latitude and longitude to your location. You can also get the coordinates here: http://itouchmap.com/latlong.html
var myLatlng = new google.maps.LatLng(25.548710, 82.084777);
var mapOptions = {
zoom: 17,
center: myLatlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
var marker = new google.maps.Marker({
position: myLatlng,
map: map
});
var infowindow = new google.maps.InfoWindow({
content:
'<div class="map-wrap">' +
// Company name
'<div class="b-title">' + 'Company Name' + '</div>' +
// Company street
'<p>' + 'Company Street' + '</p>' +
// Company city and state
'<p>' + 'Company City and State' + '</p>' +
// Clearfix with border
'<div class="clrfx map-div">' + '</div>' +
// Row 1
'<div class="row">' +
// Phone
'<div class="b-info cell w-49">' + '<span class="entypo-phone">' + '</span>' + '[phone]' + '</div>' +
// Email
'<div class="b-info cell w-49">' + '<span class="entypo-paper-plane">' + '</span>' + 'example#example.com' + '</div>' +
'</div>' +
// Row 2
'<div class="row">' +
// Mobile
'<div class="b-info cell w-49">' + '<span class="entypo-mobile">' + '</span>' + '[phone]' + '</div>' +
// Website
'<div class="b-info cell w-49">' + '<span class="entypo-monitor">' + '</span>' + 'www.example.com' + '</div>' +
'</div>' +
// Bottom margin clearfix
'<div class="clrfx mt-10">' + '</div>' +
'</div>'
});
makeInfoWindowEvent(map, infowindow, marker);
}
function makeInfoWindowEvent(map, infowindow, marker) {
google.maps.event.addListener(marker, 'click', function () {
infowindow.open(map, marker);
});
}
google.maps.event.addDomListener(window, 'load', initialize);