// You can change these to see how pipe is affected var haveStep1Fail = false; var haveStep2Fail = false; // Revealing module pattern for step 1 that ultimately calls an ajax command var step1 = (function () { var model = {}; model.process = function() { log("starting step 1"); var url = "http://fiddle.jshell.net/"; if (haveStep1Fail) { url = "http://notvalid"; } return $.ajax(url) .done(function () { log('step1 done'); }) .fail(function () { log('step1 failed'); }); }; return model; }()); // Revealing module pattern for step 2 that ultimately calls an ajax command var step2 = (function () { var model = {}; model.process = function() { log("starting step 2"); var url = "http://fiddle.jshell.net/"; if (haveStep2Fail) { url = "http://notvalid"; } return $.ajax(url) .done(function () { log('step2 done'); }) .fail(function () { log('step2 failed'); }); }; return model; }()); // this is just a simple logger so you don't have to use the console to see what is happening. function log(message) { $("#output").append($("<div></div>").text(message)); }; log("start of process"); // the pipe method will chain calls together to allow for one step to rely on another. step1.process().pipe(step2.process) .done(function () { log("the process completed successfully"); }) .fail(function () { log("one of the steps failed"); }) .always(function () { log("end of process"); }); // If you comment out the pipe lines and uncomment the $.when you can see that the when // is similar but it will run each of the steps but then wait on their completion to begin. //$.when(step1.Get(), step2.Get()).then(function () { console.log("done"); });
<div id="output"></div>