javascript - change centre of google map with change in city name from action method in controller -


i have simple java script code this---

 <script type="text/javascript">             $(document).ready(function () {         var localityurl = '@url.action("fetchlocalities")';         var sublocalityurl = '@url.action("fetchsublocalities")';         var localities = $('#selectedlocality');         var sublocalities = $('#selectedsublocality');         $('#selectedcity').change(function () {             codeaddress();             localities.empty();             sublocalities.empty();             $.getjson(localityurl, { id: $(this).val() }, function (data) {                 if (!data) {                    // codeaddress();                     return;                 }                 localities.append($('<option></option>').val('').text('please select'));                 $.each(data, function (index, item) {                     localities.append($('<option></option>').val(item.value).text(item.text));                 });             });         }) 

and codeaddress function this--

   function codeaddress() {                 var lat = document.getelementbyid('selectedcity').latitude;                 var lng = document.getelementbyid('selectedcity').longitude;                 var mylatlng = new google.maps.latlng(lat, lng);                 var myoptions = {                     zoom: 13,                     center: mylatlng,                     maptypeid: google.maps.maptypeid.roadmap                 };                 map = new google.maps.map(document.getelementbyid("map_canvas"), myoptions); 

and fetchcities action method is---

      public list<city> fetchcities()    {        list<city> cities = new list<city>();        cities.add(new city() { id = 1 , name = "--select city--" });        cities.add(new city() { id = 2, name = "faridabaad", latitude = 28.4211m, longitude = 77.3078m });        cities.add(new city() { id = 3, name = "greater noida", latitude = 28.4962m, longitude = 77.5360m });        return cities;       } 

i want change google map change in city name calling codeaddress function. problem google map loading fine there no change in google map city name changing.you can have @ full code here http://pastebin.com/6hwcpg9a , controller is--http://pastebin.com/2zy7fntj plzz tell me codeaddress function correct or not???will work inside selectedcity.change(function).what changes made if plzz me**

right now, have tried geocoding feature of google map , tried pass latitude longitude failed once again---the code it's not working it's showing other places on google map--

  var address = document.getelementbyid('selectedcity').value;                 geocoder.geocode({ 'address': address }, function (results, status) {                     if (status == google.maps.geocoderstatus.ok) {                         var latitude = results[0].geometry.location.lat();                         var longitude = results[0].geometry.location.lng();                         var latlng = new google.maps.latlng(latitude, longitude);                         var myoptions = {                             zoom: 13,                             center: latlng,                             maptypeid: google.maps.maptypeid.roadmap                         };                         map = new google.maps.map(document.getelementbyid("map_canvas"), myoptions);                         geocoder = new google.maps.geocoder(); 

as far see there few errors:

  1. there no methods nor properties latitude , longitude.
  2. you're not populating element none of data.

replace line:

$.each(data, function (index, item) {                      localities.append($('<option></option>').val(item.value).text(item.text));                  });

with that:

$.each(data, function (index, item) {                          localities.append($('<option data-lat='+item.latitude +' data-lng='+item.longitude+'></option>').text(item.text));                      });

and this:

var lat = document.getelementbyid('selectedcity').latitude;                      var lng = document.getelementbyid('selectedcity').longitude;

with that:

var lat = $('#selectedcity').data('lat'),                      lng = $('#selectedcity').data('lng');

and 1 more thing. there nice field in mssql called dbgeography storing coordinates few nice properties. google ;-)


Comments

Popular posts from this blog

Fail to load namespace Spring Security http://www.springframework.org/security/tags -

sql - MySQL query optimization using coalesce -

unity3d - Unity local avoidance in user created world -