Question

I am creating an application using the Google maps API and JSP. I am having a problem because when I add an event to a marker and pass the value using a query string I am constantly getting the same value and not the actual value of the marker. Could somebody please let me know what I am doing wrong?

 <%

            Query query2 = em.createNamedQuery("Factories.findAll");
            List<Factories> factories = query2.getResultList();

            for (int i = 0; i < factories.size(); i++) {
                Float longitude = factories.get(i).getLongitude();
                Float latitude = factories.get(i).getLatitude();
                String name = factories.get(i).getName();
                Integer id = factories.get(i).getFactoryID();
        %>

                var marker = new google.maps.Marker({
                    position: new google.maps.LatLng(<%=latitude%>, <%=longitude%>),
                    raiseOnDrag:true,
                    title: "<%=name%>",
                    clickable:true,
                    zIndex: <%=id%>,
                    map: map
                });
                google.maps.event.addListener(marker, 'click', function() { 
                    window.location = "viewFireworksFactory.jsp?id=" + marker.getZIndex();
                });

        <% }%>

Answer 1

Look at the generated JavaScript. It will look like the following:

var marker = new google.maps.Marker({
                position: new google.maps.LatLng(245, 654),
                raiseOnDrag:true,
                title: "A",
                clickable:true,
                zIndex: 1,
                map: map
            });
google.maps.event.addListener(marker, 'click', function() { 
    window.location = "viewFireworksFactory.jsp?id=" + marker.getZIndex();
});

var marker = new google.maps.Marker({
                position: new google.maps.LatLng(654, 987),
                raiseOnDrag:true,
                title: "B",
                clickable:true,
                zIndex: 2,
                map: map
            });
google.maps.event.addListener(marker, 'click', function() { 
    window.location = "viewFireworksFactory.jsp?id=" + marker.getZIndex();
});

var marker = new google.maps.Marker({
                position: new google.maps.LatLng(985, 2315),
                raiseOnDrag:true,
                title: "C",
                clickable:true,
                zIndex: 3,
                map: map
            });
google.maps.event.addListener(marker, 'click', function() { 
    window.location = "viewFireworksFactory.jsp?id=" + marker.getZIndex();
});

var marker = new google.maps.Marker({
                position: new google.maps.LatLng(6855, 464),
                raiseOnDrag:true,
                title: "D",
                clickable:true,
                zIndex: 4,
                map: map
            });
google.maps.event.addListener(marker, 'click', function() { 
    window.location = "viewFireworksFactory.jsp?id=" + marker.getZIndex();
});

So, in clear, it will redefine the same marker variable N times, overwriting the previous definition of the same variable. And all the listeners will thus get the Z index in the marker referenced by the last object assigned to the variabe.