Question

I have 2 ajax call in 2 difference functions. I want to use .click to call these 2 functions
. The func1 is inserting data in to database, then func2 is to retrieve the data so my question is how to wait until the func1 fully complete then it only execute the func2.

I tried .delay(), it works but i think this is a stupid solution.

  $("#updateLocation").click(function(e){
      e.preventdefault;
        func1();
        func2();
      });
      return false;
    });

    function func1(){
      $.ajax({
        url:'',
      });
});

    function func2(){
      $.ajax({
        url:'',
      });
})；

Answer 1

Three ways:

Call func2 on success of func1:

    function func1() {
       $.ajax({ ... }).done(func2);
    }

Use Deferred API to call func2 when func1 completes:

    e.preventDefault();
    $.when(func1).then(func2);

Make func1 synchronous (not recommended):

    function func1() {
       $.ajax({url: '', async: false});
    }