jQuery Deferred

by paska

HTML

<script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
<div id="log"></div>

JavaScript

$(function() {
	var $logDiv = $("#log");
	function log(msg) {
		$logDiv.append("<br/>" + msg);
	}
    
    function doIt() {
        return $.ajax({
            url: "/echo/json/",
            beforeSend: function() {
                log("sending ajax1");
            }
        })
        .fail(function() {
            log("ajax1 failed");
        })
        .then(function(resp) {
            log("ajax1 succed: " + resp);

            return $.ajax({
                url: "/echo/json/",
                beforeSend: function() {
                    log("sending ajax2");
                }
            }).done(function(resp2) {
                log("ajax2 succed: " + resp2);
            }).fail(function() {
                log("ajax2 failed");
            });

        })
        .always(function() {
        	log("the end");
        });
    }
    
    doIt()
    	.done(function() {
        	log("work was done!");
        })
        .fail(function() {
        	log("work failed :(");
        });
});