(JQuery) AJAX delete list item link problem
Posted: Tue Jan 05, 2010 8:07 am
I have a "list" of database entries with an Edit and Delete link next to each one of them.
Instead of using an <a> link and just doing something like href="index.php?action=delete&id=2" I am trying to use AJAX in order to do the deletion.
Each delete link has the class ".delete-link", each delete link is wrapped with a form and a hidden field holding the ID of the entry.
and then, there is a javascript event for it:
This only works with the very first entry no matter what delete-link I click on. I need it to work for each link individually.
Instead of using an <a> link and just doing something like href="index.php?action=delete&id=2" I am trying to use AJAX in order to do the deletion.
Each delete link has the class ".delete-link", each delete link is wrapped with a form and a hidden field holding the ID of the entry.
Code: Select all
<form method="post" class="form">
<a class="delete-link"><img src="images/cross.png" border="0" alt="" /> Delete</a>
<input type="hidden" class="row_id" value="'.$row_id.'" />
<input type="hidden" class="request" value="deleteEntry" />
</form>Code: Select all
$(".delete-link").click(function(ev)
{
var request = $(".request").attr("value"); //request type, in this case is "deleteEntry"
var row_id = $(".row_id").attr("value"); //it should get the id of the .delete-link I click on
$.ajax({
url: "admin-requests.php",
type: "POST",
cache: false,
data: "request="+ request +
"& row_id="+ row_id
,
beforeSend: function(){
//loading function
},
success: function(data){
//entry deleted, animate and fade out the entry
$("#"+row_id+"").animate({ backgroundColor: "#ff2d2d" }, 200);
$("#"+row_id+"").effect("fold","",600);
},
error: function(){
//error function
}
});
});