i want set $lat , $lon google map. mean, want set variables when user drags marker specific location , set them form without ajax , send server. more clearly, want values title, description , latitude , longitude ... in page. here code. bring briefly .
<form method="post"> <input type="hidden" name="submit" value="yes"> <input id="searchadd" type="text" class="form-control" onfocus="initialfill()" placeholder="enter address"> <div id="location_incident" style="height:400px;"> <script> showcurrent(locationofincident); </script> </div> <input type="text" name="title"> </form> <script> var latincident, lonincident,map, marker; function locationofincident(current){ var lat=current.coords.latitude; latincident=lat; var lon=current.coords.longitude; lonincident=lon; var mapoption={ center: new google.maps.latlng(lat,lon), zoom:8, maptypeid: google.maps.maptypeid.roadmap }; map= new google.maps.map(document.getelementbyid('location_incident'),mapoption); marker= new google.maps.marker({ position: new google.maps.latlng(lat,lon), map:map, draggable:true, title:'location of incident' }); google.maps.event.addlistener(marker,'dragend',function(res){ latincident=res.latlng.lat(); lonincident=res.latlng.lng(); getaddress(latincident,lonincident); }); } function showcurrent(s){ if(navigator.geolocation){ navigator.geolocation.getcurrentposition(s); } } var add={}; function getaddress(lat,lon){ var latlng= new google.maps.latlng(lat,lon); var geocoder= new google.maps.geocoder(); geocoder.geocode({'latlng':latlng}, function(results,status){ if(status==google.maps.geocoderstatus.ok){ if(results[0]){ add['address']=(results[0].formatted_address); } } }); } </script>
set hidden fields in form lat, long etc(whatever want).
<form method="post"> <input type="text" name="title"> <input type="hidden" name="long" id="long"> <input type="hidden" name="lat" id="lat"> <input type="hidden" name="submit" value="yes"> <input id="searchadd" type="text" class="form-control" onfocus="initialfill()" placeholder="enter address"> <div id="location_incident" style="height:400px;"> <script type="text/javascript"> showcurrent(locationofincident); </script> </div> </form>
script
<script type="text/javascript"> var latincident, lonincident,map, marker; function locationofincident(current) { var lat=current.coords.latitude; latincident=lat; var lon=current.coords.longitude; lonincident=lon; var mapoption={ center: new google.maps.latlng(lat,lon), zoom:8, maptypeid: google.maps.maptypeid.roadmap }; map= new google.maps.map(document.getelementbyid('location_incident'),mapoption); marker= new google.maps.marker({ position: new google.maps.latlng(lat,lon), map:map, draggable:true, title:'location of incident' }); google.maps.event.addlistener(marker,'dragend',function(res){ latincident=res.latlng.lat(); lonincident=res.latlng.lng(); getaddress(latincident,lonincident); }); } function showcurrent(s) { if(navigator.geolocation){ navigator.geolocation.getcurrentposition(s); } } var add={}; function getaddress(lat,lon) { $('#long').val(lon); $('#lat').val(lat); var latlng= new google.maps.latlng(lat,lon); var geocoder= new google.maps.geocoder(); geocoder.geocode({'latlng':latlng}, function(results,status){ if(status==google.maps.geocoderstatus.ok){ if(results[0]){ add['address']=(results[0].formatted_address); } } }); } </script>
Comments
Post a Comment