JQuery ajax success help
- by Jason
Hi all,
I am implementing a "Quick delete" function into a page I am creating. The way it works is like this:
1: You click the "delete" button in the table row for the record that you want to delete.
2: The page sends a request to the ajax page and return a successfully message of "yes" or a failure message of "no".
My issue is that if I get a successful message of "yes" I want to hide the row for that record. I am having issue "finding" the row using JQuery.
Here is my jquery code:
$(document).ready(function(){
$(".pane .btn-delete").click(function(){
var element = $(this);
var del_id = element.attr("id");
var dataString = 'action=del&cid=' + del_id;
if(confirm("Are you sure you want to delete this content block?"))
{
$("#msgbox").addClass('ajaxmsg').text('Checking permissions....').fadeIn(1000);
$.ajax({
type: "get",
url: "ajax/admArticles_ajax.php",
data: dataString,
success: function(data){
switch(data)
{
case "yes":
$("#msgbox").addClass('ajaxmsg').text('Deleting content block....').fadeIn(1000);
$(this).parents(".pane").animate({ backgroundColor: "#fbc7c7" }, "fast")
.animate({ opacity: "hide" }, "slow")
break
case "no":
$("#msgbox").removeClass().addClass('error').text('You do not have the correct permissions to delete this content....').fadeIn(1000);
break
default:
};
}
});
}
return false;
});
});
This is the lines of code I am using to hide the row however it is not working because I don't think $(this).parents(".pane") finds the element.
$(this).parents(".pane").animate({ backgroundColor: "#fbc7c7" }, "fast")
.animate({ opacity: "hide" }, "slow")
Any help would be greatly appreciated. Thanks...