Solved

<asp:repeater issue - not working or missing?

Posted on 2014-02-05
5
1,158 Views
Last Modified: 2014-02-07
I copied some code of the net to plot multiple markers on a google map, taking the longs and lats from a db call.  my page doesnt return any errors, but no map either - nothing at all. I am passing the parameters thru the URL, and have validated using sql trace that the procedure is running. Im assuming its returning rows since the same syntax in SSMS returns rows.

i do notice that i get a error with the squggly underline under my <asp: tag saying  "expected expression".  And intellisense doesnt include a repeater when i retype the <asp:, so maybe a library is missing?

Code from the ASP page is below. Thanks in advance.

"
<%@ Page Language="VB" AutoEventWireup="false" CodeFile="VB.aspx.vb" Inherits="VB" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <title>Market Map</title>
</head>
<body>
     <div id="dvMap" style="width: 500px; height: 500px">
    </div>
</body>
</html>

   <script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false"></script>
    <script type="text/javascript">
    var markers = [
    <asp:repeater ID="rptMarkers" runat="server">
    <ItemTemplate>
             {
                "title": '<%# Eval("Name") %>',
                "lat": '<%# Eval("Latitude") %>',
                "lng": '<%# Eval("Longitude") %>',
                "description": '<%# Eval("Description") %>'
            }
    </ItemTemplate>
    <SeparatorTemplate>
        ,
    </SeparatorTemplate>
    </asp:Repeater>
    ];
    </script>
    <script type="text/javascript">

        window.onload = function () {
            var mapOptions = {
                center: new google.maps.LatLng(markers[0].lat, markers[0].lng),
                zoom: 8,
                mapTypeId: google.maps.MapTypeId.ROADMAP
            };
            var infoWindow = new google.maps.InfoWindow();
            var map = new google.maps.Map(document.getElementById("dvMap"), mapOptions);
            for (j = 0; j < markers.length; j++) {
                var data = markers[j]
                var myLatlng = new google.maps.LatLng(data.lat, data.lng);
                var marker = new google.maps.Marker({
                    position: myLatlng,
                    map: map,
                    title: data.title
                });
                (function (marker, data) {
                    google.maps.event.addListener(marker, "click", function (e) {
                        infoWindow.setContent(data.description);
                        infoWindow.open(map, marker);
                    });
                })(marker, data);
            }
        }
    </script>
"
0
Comment
Question by:mikegrad7
  • 3
  • 2
5 Comments
 
LVL 35

Accepted Solution

by:
Robert Schutt earned 500 total points
ID: 39838788
The code is mostly valid (usually a capital R is used for asp:Repeater and script blocks would be put just before the /body tag) but Visual Studio has a problem displaying the asp tags within the <script> tags.

You can see this by making sure the javascript doesn't error when the markers array is empty by changing this line:
center: new google.maps.LatLng(markers.length ? markers[0].lat : 51.228, markers.length?markers[0].lng:5.727),

Open in new window

The map will show, just no markers...

The reason is because the repeater needs to be bound to the data, for example:
<asp:Repeater ID="rptMarkers" runat="server" DataSourceID="SqlDataSource1">

Open in new window


Anyway, another way to do this is using code behind (maybe easier, especially if your database code is already in code-behind). In the aspx, use this:
<body>
    <form id="form1" runat="server">
    <div id="dvMap" style="width: 500px; height: 500px">
    </div>
    </form>

<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false"></script>
<script type="text/javascript">
    var markers = [
// start of generated objects from code-behind

<%=getMarkerObjects() %>

// end of generated objects from code-behind
    ];

    window.onload = function () {
        var mapOptions = {
            center: new google.maps.LatLng(markers[0].lat, markers[0].lng),
            zoom: 8,
            mapTypeId: google.maps.MapTypeId.ROADMAP
        };
        var infoWindow = new google.maps.InfoWindow();
        var map = new google.maps.Map(document.getElementById("dvMap"), mapOptions);
        for (j = 0; j < markers.length; j++) {
            var data = markers[j]
            var myLatlng = new google.maps.LatLng(data.lat, data.lng);
            var marker = new google.maps.Marker({
                position: myLatlng,
                map: map,
                title: data.title
            });
            (function (marker, data) {
                google.maps.event.addListener(marker, "click", function (e) {
                    infoWindow.setContent(data.description);
                    infoWindow.open(map, marker);
                });
            })(marker, data);
        }
    }
</script>

</body>
</html>

Open in new window

Then in the code-behind (F7), add this:
Protected Function getMarkerObjects() As String
        Const indent As String = "    "
        Dim dt = New DataTable
        dt.Columns.AddRange({New DataColumn("Name", GetType(String)), New DataColumn("Latitude", GetType(Double)), New DataColumn("Longitude", GetType(Double)), New DataColumn("Description", GetType(String))})
        dt.Rows.Add({"p1", 51.228, 5.727, "p1"})
        dt.Rows.Add({"p2", 45.912, 12.782, "p2"})
        Dim ret As String = String.Empty
        For Each r In dt.Rows
            ret &= IIf(ret.Equals(String.Empty), "", indent & "," & vbCrLf) & _
                indent & "{" & vbCrLf & _
                    indent & indent & """title"": '" & r("Name") & "'," & vbCrLf & _
                    indent & indent & """lat"": '" & r("Latitude") & "'," & vbCrLf & _
                    indent & indent & """lng"": '" & r("Longitude") & "'," & vbCrLf & _
                    indent & indent & """description"": '" & r("Description") & "'" & vbCrLf & _
                indent & "}" & vbCrLf
        Next
        Return ret
    End Function

Open in new window

0
 
LVL 1

Author Comment

by:mikegrad7
ID: 39838823
thanks! ill try this today and comment!
0
 
LVL 1

Author Comment

by:mikegrad7
ID: 39842181
Hi Robert, thanks for you post! im close to getting this working, i may have a few more questions tomorrow.
0
 
LVL 35

Expert Comment

by:Robert Schutt
ID: 39842911
No problem, I'll be monitoring.
0
 
LVL 1

Author Comment

by:mikegrad7
ID: 39843000
so i have it working, and points awarded. What you showed me was a great starting point and really helped with the multiple point aspect. I did have to move things around a bit, based on what i read on some Google Maps API documentation.

What really messed me up was that once i had the DB connection working, it wouldnt work for more than 2 at a time. after digging around for awhile, i noticed my Name data had single quotes in it. on the 3rd item the single quote messed up the code generated, and crashed the page.
0

Featured Post

Live: Real-Time Solutions, Start Here

Receive instant 1:1 support from technology experts, using our real-time conversation and whiteboard interface. Your first 5 minutes are always free.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

This article discusses the ASP.NET AJAX ModalPopupExtender control. In this article we will show how to use the ModalPopupExtender control, how to display/show/call the ASP.NET AJAX ModalPopupExtender control from javascript, how to show/display/cal…
Problem Hi all,    While many today have fast Internet connection, there are many still who do not, or are connecting through devices with a slower connect, so light web pages and fast load times are still popular.    If your ASP.NET page …
This is used to tweak the memory usage for your computer, it is used for servers more so than workstations but just be careful editing registry settings as it may cause irreversible results. I hold no responsibility for anything you do to the regist…
In a recent question (https://www.experts-exchange.com/questions/28997919/Pagination-in-Adobe-Acrobat.html) here at Experts Exchange, a member asked how to add page numbers to a PDF file using Adobe Acrobat XI Pro. This short video Micro Tutorial sh…

816 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

13 Experts available now in Live!

Get 1:1 Help Now