Sample of Deferred Object - Twitter $.when()
HTML
<script src="https://getfirebug.com/firebug-lite-debug.js"></script>
<input type="submit" id="button" value="search" />
<table>
<tr>
<td id="td1"></td>
<td id="td2"></td>
</tr>
</table>
CSS
#td1 {
background-color:#eee;
}
#td2 {
color:#eee;
background-color:#111;
}
JavaScript
if ((!window.firebug || !firebug.firebuglite) &&
(!window.console || !console.firebuglite)) {
window.console = {};
window.console['log'] = function () {}
}
var Twitter = {
search: function(query) {
var defer = $.Deferred();
$.ajax({
url: "http://search.twitter.com/search.json",
data: {
q: query,
rpp: 50
},
dataType: 'jsonp',
success: defer.resolve,
error: defer.reject
});
return defer.promise();
}
};
$('#button').on('click', function() {
$.when(Twitter.search('jquery deferred'), Twitter.search('jquery when'))
.then(function(data1, data2){
console.log(data1);
console.log(data2);
$(data1[0].results).each(function(k,v){
$('#td1').append(v.text + '<br/>');
});
$(data2[0].results).each(function(k,v){
$('#td2').append(v.text + '<br/>');
});
});
});