javascript - On Button click Event pass latitude and longitude CORRESPONDING Place Display on Google Map -

i fetch coordinates database , displaying corresponding place on google map , it's work when pass coordinates on button click it's not working.here code:

 function load() {         var map = new google.maps.map(document.getelementbyid("map"), {         center: new google.maps.latlng(10.5167,7.4333),         zoom: 13,         maptypeid: 'roadmap'       });       var infowindow = new google.maps.infowindow;        // click event        google.maps.event.addlistener(map, 'click', function(e) {       document.getelementbyid('txtlat').value=e.latlng.lat() ;     document.getelementbyid('txtlong').value=e.latlng.lng();    });       // change depending on name of php file       downloadurl("xmlcustloc.php", function(data) {         var xml = data.responsexml;         var markers = xml.documentelement.getelementsbytagname("marker");         (var = 0; < markers.length; i++) {           var name = markers[i].getattribute("name");            var des = markers[i].getattribute("des");            var point = new google.maps.latlng(               parsefloat(markers[i].getattribute("lat")),               parsefloat(markers[i].getattribute("lng")));           var html = "<b>" + name + "</b> <br/>"+des ;           var icon = customicons['simple'] || {};           var marker = new google.maps.marker({             map: map,             position: point,             icon: icon.icon,             shadow: icon.shadow           });           bindinfowindow(marker, map, infowindow, html);         }       });     }      function bindinfowindow(marker, map, infowindow, html) {       google.maps.event.addlistener(marker, 'click', function() {         infowindow.setcontent(html);         infowindow.open(map, marker);       });     }      function downloadurl(url, callback) {       var request = window.activexobject ?           new activexobject('microsoft.xmlhttp') :           new xmlhttprequest;        request.onreadystatechange = function() {         if (request.readystate == 4) {           request.onreadystatechange = donothing;           callback(request, request.status);         }       };        request.open('get', url, true);       request.send(null);     }      function donothing() {} 

above code working when pass coordinates on button click place not displaying here code on button click :

$(function() {    $("#btncheck").click(function() {      var lat=document.getelementbyid('txtlat').value;    alert(lat);         var lng=document.getelementbyid('txtlong').value;          alert(lng);        var point = new google.maps.latlng(lat,lng);            var icon = customicons['search'] || {};           var marker = new google.maps.marker({             map: map,             id: 'markershowhide',             position: point,             icon: icon.icon,             shadow: icon.shadow           });     });  }); 

i appreciate have offer. thank you!

i've built simple jsfiddle based on code, without ajax calls.

var map; function initialize() {     var mapoptions = {         center: new google.maps.latlng(10.5167,7.4333),         zoom: 8,         maptypeid: google.maps.maptypeid.roadmap     };     map = new google.maps.map(document.getelementbyid("map-canvas"), mapoptions);      google.maps.event.addlistener(map, 'click', function(e) {         latinput.value = e.latlng.lat() ;         longinput.value = e.latlng.lng();     }); }  var latinput = document.getelementbyid('lat'); var longinput = document.getelementbyid('long');  function addmarker(){     var lat = latinput.value;     var long = longinput.value;      if(!lat || !long) return;      var coords = new google.maps.latlng(lat,long);     var marker = new google.maps.marker({         map: map,         position: coords     }); }  google.maps.event.adddomlistener(document.getelementbyid('go'), 'click', addmarker); google.maps.event.adddomlistener(window, 'load', initialize); 

jsfiddle