1

I want this functionality to my project.

I am trying to provide the functionality, Onbutton click, I fetch the coordinates data from MySQL into an array and then put this array to the value of the text box, so that JavaScript read this value. But when I put the var coordinates value to polyline it shows blank and when I copy the same value from the textbox and pase it to the same var its working.

Java code:

try {
Connection.getConnection();
java.sql.PreparedStatement preparedStatement = Connection.con
                .prepareStatement("select * from co_ordinates_data");

        resultSet = preparedStatement.executeQuery();

        while (resultSet.next()) {

            latitude.add(resultSet.getDouble("latitude"));
            longitude.add(resultSet.getDouble("longitude"));

            latlong.add("new google.maps.LatLng("
                    + resultSet.getDouble("latitude") + ","
                    + resultSet.getDouble("longitude") + ")");

        }

        size = latitude.size();

    } catch (Exception e) {
        System.out.println("path exception " + e.toString());
    }
    return "execute";

//textbox
<input type="text" id="latlng" value="<s:property value="latlong"/>"

here is my js code:

function initialize() {
    var myLatLng = new google.maps.LatLng(28.493729, 77.09255);
    var mapOptions = {
        zoom : 8,
        center : myLatLng,
        mapTypeId : google.maps.MapTypeId.ROADMAP
    };

    var map = new google.maps.Map(document.getElementById("map-canvas"),
            mapOptions);

    var cordinates = document.getElementById("latlng").value;


    var flightPlanCoordinates = [cordinates ];

    var flightPath = new google.maps.Polyline({
        path : flightPlanCoordinates,
        strokeColor : "#FF0000",
        strokeOpacity : 1.0,
        strokeWeight : 2
    });

    flightPath.setMap(map);
}
j0k
  • 22,600
  • 28
  • 79
  • 90

1 Answers1

0

Probably the problem is that, when you run your initialize() Javascript function, the page is not fully loaded, and the <input /> element containing your coordinates is not yet rendered;

Try calling initialize() from a javascript console (in Firefox, CTRL+SHIFT+K), to see if it works.

You need to enclose the call to your javascript in a jQuery $(document).ready() function (more info here), or to move your javascript function out of the <head> part, placing it at the end of the <body> part (not recommended).

Example:

function initialize(){
   // all your stuff as above...
   // all your stuff as above...
   // all your stuff as above...
}

$(document).ready(function() {
    initialize();
});
Community
  • 1
  • 1
Andrea Ligios
  • 49,480
  • 26
  • 114
  • 243
  • Thanks for your revert Andrea, i tried your solution but sorry to say its not working for me. I remove the initialize function from body onload and put that JQuery, after that my map is not visible. – user2306164 Apr 23 '13 at 11:07
  • can anyone share the code to give the same functionality using struts2 – user2306164 Apr 23 '13 at 11:37
  • Mmm... can you provide a Fiddle ? (http://jsfiddle.net , select jQuery onDomReady on the left) – Andrea Ligios Apr 23 '13 at 11:41
  • Dude, a fiddle is not just a "bin" where paste some code, it should be a working editable demo... your fiddle is not working :/ First you need to remove struts tags, because fiddle is client-side only, then you need to reproduce the html that you see in view-source from browser, not in your ide (I've did it for you http://jsfiddle.net/6BnH3/5/), and after you need to make it work – Andrea Ligios Apr 24 '13 at 12:20