Returning SQL Insert ID when using Jquery/AJAX to insert row into database

Question

Im trying to add an element to a database and then return a new id for it based on the the sql_insert_id

Its adding the element correctly and the console is returning the id i want to use but for some reason its not actually changing it on the element.

Im just using an echo in my actions.php script to return the string.

$(".add").click(function () {
 $(this).parent().parent().parent().parent().appendTo("#folderwrap");
 $(".thumbnailoverlay").hide();
 var imageidlong = $(this).parent().parent().parent().parent().attr("id");
 var imageid = imageidlong.replace("imageid_", "");
 $.post("actions.php?action=addfolderimage&imageid="+imageid, function(data){
  console.log(data);
  $(this).parent().parent().parent().parent().attr("id", data);
 });
});

Thanks in advanced for your help

Answer 1

In your callback $(this) won't refer to your element any more - try this instead:

$(".add").click(function () {
        var elm = $(this).parent().parent().parent().parent();

     elm.appendTo("#folderwrap");
        $(".thumbnailoverlay").hide();
        var imageidlong = elm.attr("id");
        var imageid = imageidlong.replace("imageid_", "");

        $.post("actions.php?action=addfolderimage&imageid="+imageid, function(data){
                console.log(data);
                elm.attr("id", data);
        });
});

This creates a closure containing elm