Select "this" element after completed ajax call

Question

Using Jquery, after a completed ajax call, how can I say remove() this element you just clicked? Using the following code doesn't work:

$( ".deletegid" ).click(function() {   
    var imageid = $(this).attr('name');
    $.ajax({
        type: "POST",
        url: "/public/index.php/admin/content/athletes/deleteimagefromgallery",
        data: {
            imageid: imageid,
            galleryid: $("input[name=athletes_gid]").val(),
            ci_csrf_token: $("input[name=ci_csrf_token]").val()
        }
    })
    .done(function() {
        $(this).remove();           
    });
});

score 4 · Accepted Answer · answered Sep 03 '14 at 08:15

Use context option of ajax to set context to current element:

$.ajax({
    type: "POST",
    context:this,
    url: "/public/index.php/admin/content/athletes/deleteimagefromgallery",
    data: { imageid: imageid ,galleryid: $("input[name=athletes_gid]").val(), ci_csrf_token: $("input[name=ci_csrf_token]").val() }
})
.done(function() {
    $(this).remove();           
});

score 1 · Answer 2 · answered Sep 03 '14 at 08:16

Keep it in a variable

$(".deletegid").click(function() {
    var obj = $(this);
    var imageid = $(this).attr('name');
    $.ajax({
            type: "POST",
            url: "/public/index.php/admin/content/athletes/deleteimagefromgallery",
            data: {
                imageid: imageid,
                galleryid: $("input[name=athletes_gid]").val(),
                ci_csrf_token: $("input[name=ci_csrf_token]").val()
            }
        })
        .done(function() {
            obj.remove();
        });
});

this refers to ajax object in done event.

score 0 · Answer 3 · answered Sep 03 '14 at 08:17

Use as

$(".deletegid").click(function() {
var objectControl = $(this);
var imageid = objectControl.attr('name');
$.ajax({
        type: "POST",
        url: "/public/index.php/admin/content/athletes/deleteimagefromgallery",
        data: {
            imageid: imageid,
            galleryid: $("input[name=athletes_gid]").val(),
            ci_csrf_token: $("input[name=ci_csrf_token]").val()
        }
    })
    .done(function() {
        objectControl.remove();
    });

});

Select "this" element after completed ajax call

3 Answers3