Question

I’ve been using the following snippet on my ajax form submits:

$.ajax({
url: "",
data: ilmoittautumisdata,
type: "POST",
success:function(){

});
error:function(){

});
});

However, I remember that I was told to stop using success and error within it, as they’re deprecated (?) and instead use $.ajaxComplete(); and $.ajaxError();.

However, reading the docs isn’t helping me as I want to use both of them, and this isn’t working for me.

$('#ilmoittuminen').submit(function(){
            var ilmoittautumisdata = $('#ilmoittuminen').serialize();
            $.ajax({
                //url: "",
                data: ilmoittautumisdata,
                type: "POST"
                });
            $.ajaxComplete(
            function(){
            $('#ilmoittuminen').slideUp();
            });
            $.ajaxError(
            function(){

            });
    return false;
    });​

How I should do it?

http://jsfiddle.net/D7qgd/

Answer 1

Firstly, the word you’re looking for is “deprecated”. As far as I’m aware, the success and error properties are definitely not deprecated. You can (and should, in your case) continue to use them.

The problem with your attempt to use ajaxError and ajaxComplete is that they are implemented as instance methods, rather than static methods on the jQuery object itself. For that reason, you need to select some element and call the methods on that collection. The element itself doesn’t matter at all:

$("#someElement").ajaxComplete(function () {
    // Do stuff
});

The next problem, which you haven’t come across yet, is that the ajaxError and related methods register global AJAX event handlers. Each time you call one of those methods, you add a new event handler to the global set, and every time an AJAX event is fired, all of your registered handlers will be executed.

---

Update (Thanks @DCoder)

Looks like the success and error properties are deprecated as of jQuery 1.8. Instead, you can use the fail, done and always methods of the jQuery modified XHR object. Any objects that inherit from the deferred object can use these methods (the jqXHR object is one of these):

$.ajax(ajaxSetupObject).done(function () {
    // Handle success
}).error(function () {
    // Handle error
});