Question

I have the following code,

$(".delete.red").live("click", function () {
    var self = $(this);
    var loadUrl = $(this).attr('href');
    alert("clicked");
    //var interestParents = self.parents('div:eq(4)').attr("id");
    $.ajax({
        type: "POST",
        url: loadUrl,
        dataType: "json"
    }).success(function (msg) {
        alert(msg);
        self.parent().parent().parent().parent().parent().parent().remove();
        $(".selected strong").text(msg.icount)

    });
    return false;
});

What this code does it on click of a link it sends a request off to the clicked links href, it should then find the outermost parent of that link and remove itself from the markup.

Howevever the request is not getting to the done() function I am getting now feedback it is almost as if it is not being called, which seems strange as when I look at the network tab, I can see the links href has been access, and I can see 200 OK response.

Waht is going on?

Answer 1

Make success part of the options object passed as an argument

$.ajax({
        type: "POST",
        url: loadUrl,
        dataType: "json",
        success: function (msg) {
            alert(msg);
            self.parent().parent().parent().parent().parent().parent().remove();
            $(".selected strong").text(msg.icount);
        }
});

The success callback has been deprecated in jQuery 1.8 according to the website

Deprecation Notice: The jqXHR.success(), jqXHR.error(), and
jqXHR.complete() callbacks will be deprecated in jQuery 1.8. To
prepare your code for their eventual removal, use jqXHR.done(),
jqXHR.fail(), and jqXHR.always() instead.

According to the site, the live method has also been deprecated

As of jQuery 1.7, the .live() method is deprecated.
Use .on() to attach event handlers.