Tag Archives: call

jQuery – stop an ajax call!

javascript, micro tutorial, , ,

It’s a simple task with no simple question, although in jQuery, as I mentioned now, everything is very simple. Even this task.

In a short example we’ve a simple AJAX call with very large request.

xhr = $.ajax({
    url : 'www.example.com?some-large-call',
    success : function(responseText) {
        // some DOM manipulation
    }
});

But what if something changes the data we’d like to request with this call even before the response has come. For example I click on a category in the site but before all the data has come I’d prefer to see other category’s data. Continue reading jQuery – stop an ajax call! →

JQuery ajax script call

featured, javascript, web development, , , ,

Many friends are asking me how to they use JQuery AJAX power. However you have two main ways, using:

$(‘#elem’).load(‘url’, ”, function() {});

or

$.ajax({

type : ‘GET’, // or POST

dataType : ‘text’, // or JSON

url : ‘url’,

data : {}, // GET or POST key/value parameters

success : function () {}, // on success callback

error : function () {} // on error callback

});

Note: be careful to miss the comma after the error callback declaration, cause IE is giving some problems with objects with comma after the last key/value pair.

Both methods are useful, but however the second one is more complicated and gives more functionality. It’s important to note that if you’d like to include Html, which will be JavaScript processed after that, there are another two ways. The first one is obvious, you can call the javascript file processing the included Html in your success callback of the first ajax call. After calling the second ajax call, be aware to call it with dataType : ‘script’, which includes de js code and parses it as code. Than you can call whatever function in that .js as you’d do it as it was already included.

That method is obvious and easy, but however on slow nets it’s pretty slow and it’s not useful. Actually you can include your script file as you’d normally do it, with a script tag.

In it you should register all event listeners in methods you can call later. That’s the better way.

In the first case you have:

$.ajax({

type: ‘GET’,

dataType: ‘text’,

url: ‘the_url’,

data: {},

success : function () {

$.ajax({

type: ‘GET’,

dataType: ‘script’,

url : ‘script.js’,

success : function() {

// now do what you want

}

})

},

error : function() {

}

});

In the second case you’d just include your file:

<script src=”script.js”></script>

<script>

$.ajax({

type : ‘GET’,

dataType : ‘text’,

url : ‘url’,

success : function() {

init_script(); // method in script.js

}

});

</script>

Now everything should work OK, good luck!