Click here to Skip to main content
15,892,737 members

google maps inside mvc view using vbhtml

duffster28 asked:

Open original thread
Was hoping someone could point me in the right direction for a problem i cant seem to find the answer for - I have a googlemaps jquery inside an mvc view that plots a postcode on a map. I want to pass postcodes from my model and show multiple markers on the google map. All the examples i find are for cshtml and have a for each item in model loop to add the markers. This methodology doesnt seem to work in vbhtml ( Razor ). Attached is my view and the model just passes and Id key field and a postcode ( pcode) :

how do I pass my model.pcode in a loop to the 'var postcode' inside the javascript. I read that you can point the maps to a controller/action but when i tried this the view returns the data to the view as a long xml style string and doesnt plot the points???

Thanks in advance

Jase

XML
@ModelType IEnumerable(Of Maps_Application.Tbl_Pcodes)

@Code
    ViewData("Title") = "Index"
End Code
<pre lang="text"><pre lang="text"><pre lang="HTML">

<!DOCTYPE html>
<html>
<head>
<script src="http://maps.google.com/maps/api/js?sensor=false" type="text/javascript"></script>
</head>
<body>
<div id="map_canvas" style="width: 600px; height: 800px;"></div>
</body>
</html>



<script type="text/javascript">

var postcode = "ln5 7nq";

</script>



<script type="text/javascript">
var geocoder;
var map;

$(document).ready(function () {
initializeGoogleMap();
codeAddress();
});

function initializeGoogleMap() {
geocoder = new google.maps.Geocoder();
var latlng = new google.maps.LatLng(-34.397, 150.644);
var myOptions = {
zoom: 8,
center: latlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
map = new google.maps.Map($("#map_canvas")[0], myOptions);
}

function codeAddress() {
var address = postcode + ", UK";
geocoder.geocode({ 'address': address }, function (results, status) {
if (status == google.maps.GeocoderStatus.OK) {
map.setCenter(results[0].geometry.location);
var marker = new google.maps.Marker({
map: map,
position: results[0].geometry.location
});
} else {
alert("Geocode was not successful for the following reason: " + status);
}
});
}

</script>
Tags: Razor, MVC3, Google Map

Plain Text
ASM
ASP
ASP.NET
BASIC
BAT
C#
C++
COBOL
CoffeeScript
CSS
Dart
dbase
F#
FORTRAN
HTML
Java
Javascript
Kotlin
Lua
MIDL
MSIL
ObjectiveC
Pascal
PERL
PHP
PowerShell
Python
Razor
Ruby
Scala
Shell
SLN
SQL
Swift
T4
Terminal
TypeScript
VB
VBScript
XML
YAML

Preview



When answering a question please:
  1. Read the question carefully.
  2. Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
  3. If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
  4. Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.
Let's work to help developers, not make them feel stupid.
Please note that all posts will be submitted under the http://www.codeproject.com/info/cpol10.aspx.



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900