Page reload after all Ajax calls

Page reload after all Ajax calls

Hello all,

For each input property in the form, i need to post the values using an Ajax call.

after all the ajax call is completed, the page needs to be reloaded.

Since Ajax is a asynchronous call, the page gets reloaded even before all inputs are posted.

How can i ensure the the location.reload() is executed only after all input elements of the forms are posted?

Appreciate any advise.

  1. function postValues() {
  2.         $(".dynamicform :input").each(function() {
  3.                 postPropertyValues($(this).attr("id"));
  4.           }
  5.         );
  6.       location.reload();
  7. }

  1. function postPropertyValues(name) {  
  2.     var data = $(name).val();
  3.     $.ajax({
  4.         type: "POST",
  5.         url: url,
  6.         data: data,
  7.     }).done(function(){ 
  8.         console.log("Posted Property Name: "+name + "\tValue: "+data);
  9.     }) ; 

  11. }