php - $(Id).submit() on javascript -

i have problem following code: here's javascript

$(document).ready(function(){   $("#visualisercarte").submit(function(){       $.post("store.php",{longitudes:longitudes,latitudes:latitudes});     alert('ok');        var mapoptions = {             zoom: 13,             // center map on chicago, usa.             center: new google.maps.latlng(tableaupoints[0].lat(),tableaupoints[0].lng())         };          map = new google.maps.map(document.getelementbyid('map-canvas'), mapoptions);         var flightpath = new google.maps.polyline({             path: tableaupoints,             geodesic: true,             strokecolor: '#ff0000',             strokeopacity: 1.0,             strokeweight: 2           });         flightpath.setmap(map);    });  }); 

and here php

 <script src="google_map.js"></script>   <?php     $displayform= true;     if (isset($_post['vue'])){         $displayform= false;         }     if ($displayform){    ?>   <form  method="post" id="visualisercarte">       <input type="submit" name="vue" value="visualiser la carte"  >   </form>    <form  action="store.php" method="post" id="soumettrecarte" >       <input type="submit"  name="submit" value="soumettre la carte"  >   </form>   <?php     }     else     {   ?>   <form method="post" id="réinitialisercarte" >       <input type="submit"  value="réinitialiser" value="réinitialiser la carte"  >   </form>    <?php     }   ?>   

if click on submit form "visualisercarte", expect it alert ok, draw map polyline , form réinitialisercarte below map. when execute alert not map . if add return false; @ end of submit function, alert, right map, 2 first forms still here, while expecting have third. help? tahnks

it seems you're missing success calback (or promise interface) executed when ajax call finished. aproximate code uses deferred objects can 1 below:

$(document).ready(function(){      // send data server , store     $("#soumettrecarte").submit(function(ev) {           ev.preventdefault(); // prevent submit; let ajax call deal submit          $.post("store.php", {longitudes: longitudes,latitudes: latitudes})         .done(function (response) {             alert('soumettre carte - ok');         });      });       $("#visualisercarte").submit(function(ev){           ev.preventdefault(); // prevent submit          // hide forms         $('#visualisercarte').hide();         $('#soumettrecarte').hide();          // display last form         $('#reinitialisercarte').show();          var mapoptions = {             zoom: 13,             // center map on chicago, usa.             center: new google.maps.latlng(tableaupoints[0].lat(),tableaupoints[0].lng())         };          map = new google.maps.map(document.getelementbyid('map-canvas'), mapoptions);         var flightpath = new google.maps.polyline({             path: tableaupoints,             geodesic: true,             strokecolor: '#ff0000',             strokeopacity: 1.0,             strokeweight: 2           });         flightpath.setmap(map);       });      $('#reinitialisercarte').submit(function(ev) {         ev.preventdefault(); // prevent submit          $('#visualisercarte').show();         $('#soumettrecarte').show();         $('#reinitialisercarte').hide();     });  }); 

also php code can written:

<form  method="post" id="visualisercarte">   <input type="submit" name="vue" value="visualiser la carte"  > </form>  <form  action="store.php" method="post" id="soumettrecarte" >   <input type="submit"  name="submit" value="soumettre la carte"  > </form>  <div id="map-canvas"></div>  <form method="post" id="reinitialisercarte" style="display: none;">   <input type="submit"  value="réinitialiser" value="réinitialiser la carte"  > </form> 

as can see jquery code takes care of dealing server calls , displaying of various elements.