[英]Having issue deleting a html table row using jquery dataTable
I have a html table with data inside from the database. 我有一个html表,其中包含数据库中的数据。
I want to do is remove a row from the html table but not in the database. 我想做的是从html表中删除一行,但不在数据库中。
In my action column i have a delete button in every row and if i press delete on that specific row that row should be remove. 在我的操作列中,每行都有一个删除按钮,如果我在该特定行上按Delete键,则应删除该行。
I want to remove a specific row in the html table but not the actual data from the database. 我想删除html表中的特定行,而不是数据库中的实际数据。
script: 脚本:
$(document).ready(function(){
$.ajax({
url: 'process.php',
type: 'post',
data: {tag: 'getData'},
dataType: 'json',
success: function(data){
if(data.success){
$.each(data, function(index, record){
if($.isNumeric(index)){
var row = $("<tr />");
$("<td />").text(record.name).appendTo(row);
$("<td />").text(record.age).appendTo(row);
$("<td />").text(record.gender).appendTo(row);
$("<td />").html(record.action).appendTo(row);
row.appendTo("#myTable2 tbody");
}
})
}
$('#myTable2').dataTable({
"bjQueryUI": true,
"sPaginationType": "full_numbers"
});
$("#myTable2 .dltRow").bind( "click", function(event) {
var target_row = $(this).closest("tr").get(0);
var aPos = oTable.fnGetPosition(target_row);
oTable.fnDeleteRow(aPos);
});
}
});
});
It would be easier to bind your event in your each
function, when you have a reference to the row you just created: 当您引用刚创建的行时,将事件绑定到each
函数中会更容易:
$.each(data, function(index, record){
if($.isNumeric(index)){
var row = $("<tr />");
$("<td />").text(record.name).appendTo(row);
$("<td />").text(record.age).appendTo(row);
$("<td />").text(record.gender).appendTo(row);
var $actionCell = $("<td />");
$actionCell.html(record.action)
$actionCell.find('.dltRow').on("click",
function() { row.remove(); });
$actionCell.appendTo(row);
row.appendTo("#myTable2 tbody");
}
})
Or you could keep it in your bind
call and use the remove
method there: 或者,您可以将其保留在bind
调用中,然后在其中使用remove
方法:
$("#myTable2 .dltRow").bind( "click", function(event) {
$(this).closest("tr").remove();
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.