我尝试通过按删除图标来删除一行,但我首先需要一个 SweetAlert 确认窗口。
我的代码:
$(document).ready(function() {
//$( 'button[data-target="#delete"' ).click(function() {
$('##ads-overview tbody').on('click', 'button[data-target="#delete"', function() {
swal({
title: "Weet u het zeker?",
text: "Deze actie is niet meer te herstellen",
showCancelButton: true,
confirmButtonColor: "#DD6B55",
confirmButtonText: "Ja, ik weet het zeker!",
cancelButtonText: "Annuleren",
closeOnConfirm: false,
closeOnCancel: false
}, function(isConfirm) {
if (isConfirm) {
swal("Verwijderd!", "De advertentie is succesvol verwijderd", "success");,
function() {
table.row($(this).parents('tr')).remove().draw();
}
}
} else {
swal("Geanulleerd", "De advertentie is niet verwijderd", "error");
}
});
});
});
https://jsfiddle.net/6n3zsfd5/
警报窗口未出现。我做错了什么?
最佳答案
工作版本:https://jsfiddle.net/6n3zsfd5/5/
$(document).ready(function () {
var table = $('#ads-overview').DataTable();
$('#ads-overview tbody').on('click', 'button[data-target="#delete"]', function () {
var btn = this;
swal({
title: "Weet u het zeker?",
text: "Deze actie is niet meer te herstellen",
showCancelButton: true,
confirmButtonColor: "#DD6B55",
confirmButtonText: "Ja, ik weet het zeker!",
cancelButtonText: "Annuleren",
closeOnConfirm: false,
closeOnCancel: false
}, function (isConfirm) {
if (isConfirm) {
swal("Verwijderd!", "De advertentie is succesvol verwijderd", "success");
table.row($(btn).parents('tr')).remove().draw(false);
} else {
swal("Geanulleerd", "De advertentie is niet verwijderd", "error");
}
});
});
});
您调用 SweetAlert 的方式没有任何问题。您的代码中存在一些语法错误,并且您设置数据表的方式存在问题。 (感谢 Gyrocode.com 发现了这一点!)
对于语法错误,请打开开发人员工具窗口或 Javascript 控制台以查看页面加载时引发的错误。这将引导您直接到达有问题的行。
<小时/>具体代码修复:
您需要初始化DataTable:
var table = $('#ads-overview').DataTable();
您不需要在该行的开头有两个哈希值,但在“删除”之后确实需要一个右括号:
$('##ads-overview tbody').on('click', 'button[data-target="#delete"', function(...
...^..............................................................^
该行末尾有一个逗号:
swal("Verwijderd!", "De advertentie is succesvol verwijderd", "success");,
这确实没有意义:
function() {
table.row($(this).parents('tr')).remove().draw();
}
不需要将其包装在函数中;只需调用该方法即可。
这应该可以解决所有问题。本答案顶部的 JSFiddle 包含所有这些修复。
关于jquery - 通过 SweetAlert 确认删除数据表中的行,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31898143/