0

When a link is clicked it should delete its own parent. Here is the code I am using. Its not working.

(function () {
    $(".delete-field").on("click", function () {
        var elementId = $(this).closest("[id^=field-]").attr("id");
        var fieldId = elementId.split("-")[1];

        $.ajax({
            url: "schema/objects/field/delete",
            type: 'DELETE',
            data: JSON.stringify({ id: fieldId }),
            contentType:'application/json',
            success: function (result) {
                $(this).closest("tr").remove();
            },
            error: function (result) {
                alert(result);
            }
        });
    });
})();
Luke101
  • 63,072
  • 85
  • 231
  • 359
  • What is the element of the parent in this case? Is it the same as elementId ?? – Brian Gottier Sep 03 '17 at 23:35
  • 1
    To explain the duplicate, `this` inside your `success` callback does not refer to the matched element – Phil Sep 03 '17 at 23:36
  • @BrianGottier yes, it is the same as the elementId. But the elementId variable is just a number. – Luke101 Sep 03 '17 at 23:37
  • The real problem is that this inside your success function is not the this you think it is. – Brian Gottier Sep 03 '17 at 23:38
  • Check out this answer https://stackoverflow.com/questions/6647736/how-to-delete-parent-element-using-jquery – Mohammed Sep 03 '17 at 23:38
  • above var elementId, write this: `var tr = $(this).closest("tr");` and then change your command on success with `tr.remove()`. why? because $(this) in sucess is not reference for class delete-field – plonknimbuzz Sep 04 '17 at 00:54

0 Answers0