How to call a function when using ajax promise

Pawan

I am using the following ajax promise for my application to load states and then districts related to that .

My question is can i call the getDistricts() function after completing loadStates done call ,rather than duplicating the code

$(document).ready(function() {
        var loadStates = $.ajax({
            type: 'GET',
            url: url + '/depo/depo/getstates',
            success: function(response) {
            },
            error: function(x, t, m) {
            }
        }); // End of loading states
        loadStates.done(function() {
            $("#districtsList").html("");
            $.ajax({
                type: 'GET',
                url: url + '/depo/depo/getdistricts?stateID=' + stateIDselected,
                jsonpCallback: 'jsonCallback',
                success: function(response) {
                },
                error: function(x, t, m) {

                }
            }).done(function() {
                $("#talukasList").html("");
                var talukhtml = '<option value="">All Mandals</option>';
                $("#talukasList").html(talukhtml);
                  $(".gobtn").trigger("click");
            });
        })
        $("#hideorshow").hide();

}); // ready call ends here


function getDistricts() {
    $.ajax({
        type: 'GET',
        url: url + '/depo/depo/getdistricts?stateID=' + stateIDselected,
        jsonpCallback: 'jsonCallback',
        dataType: 'jsonp',
        success: function(response) {
        },
        error: function(x, t, m) {

        }
    });
}

please let me know how to achieve this ??

Gone Coding

Get any Ajax functions to return their own promise:

function getDistricts() {
    return $.ajax({
        type: 'GET',
        url: url + '/depo/depo/getdistricts?stateID=' + stateIDselected,
        jsonpCallback: 'jsonCallback',
        dataType: 'jsonp'
    });
}

Make all your Ajax calls into similar functions (same is good):

function loadStates(){
    return $.ajax({
         type: 'GET',
        url: url + '/depo/depo/getstates'
    });
}

Then you can just chain the operations.

$(document).ready(function() {
    loadStates().done(function() {
        $("#districtsList").html("");
        getDistricts().done(function(){
            $("#talukasList").html("");
            var talukhtml = '<option value="">All Mandals</option>';
            $("#talukasList").html(talukhtml);
              $(".gobtn").trigger("click");
        });
    })
    $("#hideorshow").hide();

});

Notes:

  • You can remove the error and success callback function from the Ajax calls when using promises
  • You are missing code to do anything with the returned values from the Ajax calls, possibly removed for the example, but remember any data values are simply passed to the done() callbacks so just add the parameters there.

Collected from the Internet

Please contact [email protected] to delete if infringement.

edited at
0

Comments

0 comments
Login to comment

Related

How to call PHP function when AJAX query success

How to pass arguments to javascript function call when using onClick in Thymeleaf

How to call a pre configured postgres function when using jdbc?

How to convert function call with two callbacks to promise

How to call a codeigniter helper function using JQuery AJAX?

jquery promise return when ajax call error

How to delay a promise in when function

How to call promise function recursively

How to call an ajax function in a for loop

Jquery Ajax call with promise

How to call react logger function when using CDN

How promise is resolved by function call?

Using promise to call Ajax without duplicating code

How to call a function recursively when using a WHILE loop and break it properly?

How to put ajax request inside function and call it when necessary?

How to call or execute the change function of ajax when there is ony one option

Refactor jquery ajax call using the promise object

jQuery Promise for Ajax call

Using ajax promise with $.when().done

.done() function not being run on returned promise from AJAX call when grabbing local JSON file

In Rails, how to call an AJAX function and then refresh page when its complete?

How do I call a function within ajax using codeigniter to update

how to call function where parameter based on a promise

How to call a function when a div is dynamically generated using jQuery

How to call a php function in javascript using Ajax?

how to call function inside ajax call

How to wrap function call inside of Promise

How to call an original promise resolution when in recursive function

How to call a function after promise