1110
1110

Reputation: 6829

Razor with javascript issue

I created a google map and I want to add a list of markers on it. But I have some razor-javascript issues.
My cshtml file has a model @model IEnumerable<MCN.Domain.Entities.Location>
My model loading is fine it contains all values.
I debug JS code in browser and it gets in addMarker method but stop at var marker = new google.maps.Marker({ part.
In visual studio I have green underline on @foreach (var item in Model) { with message: "Conditional compilation is turned off" This is JS part:

<script type="text/javascript">
(function () {
        window.onload = function () {
            var mapDiv = document.getElementById('map');
            var latlng = new google.maps.LatLng('41.01146', '24.921659');
            var options = { styles: styleArray,
                center: latlng,
                zoom: 15,
                mapTypeId: google.maps.MapTypeId.ROADMAP,
                mapTypeControl: false                
            };
            var map = new google.maps.Map(mapDiv, options);

            @foreach (var item in Model) {                
                 @:addMarker(@item.Latitude, @item.Longitude, '@item.Name', '@item.DiscoveredBy');
             }           
        }
    })();

function addMarker(latitude, longitude, title, description)
{    
      var markerlatLng = new google.maps.LatLng(latitude, longitude);
      var title = 'test';
      var description = 'test';
      var contentString = 'test';

      var infowindow = new google.maps.InfoWindow({
          content: contentString
      });

      var marker = new google.maps.Marker({
          position: latLng,
          title: title,
          map: map,
          draggable: false
      });

      google.maps.event.addListener(marker, 'click', function () {
          infowindow.open(map, marker);
      });
}
</script>

JS From browser:

(function () {
        window.onload = function () {
            var mapDiv = document.getElementById('map');
            var latlng = new google.maps.LatLng('44.01146', '20.921659');
            var options = { styles: styleArray,
                center: latlng,
                zoom: 15,
                mapTypeId: google.maps.MapTypeId.ROADMAP,
                mapTypeControl: false                
            };
            var map = new google.maps.Map(mapDiv, options);

                 addMarker(20.921659, 44.01146, 'Svetozar markovic', 'user');
                 addMarker(20.92829, 44.010333, 'Glavna Stanica', 'user');



        }
    })();

Upvotes: 1

Views: 1529

Answers (2)

hsrob
hsrob

Reputation: 179

Try surrounding the code itself with parentheses. This will get rid of the error you're seeing.

Example: @Url.Action("MyAction", new { my_param = "my_value" }))

Upvotes: 0

jrummell
jrummell

Reputation: 43067

Visual Studio isn't expecting to see Razor markup in a <script> tag. That's OK - hopefully they'll add support for this in the future.

The important thing is that you're not getting javascript errors in your browser.

Upvotes: 2

Related Questions