Question

我有一个页面 test.php ，我使用jQuery DataTables获取数据。有一个＆＃34;添加注释＆＃34;同一页面中的按钮，在colorbox中打开ajax表单。表单提交工作正常但我想在我的数据库中插入记录时刷新DataTables。

数据表：

$(document).ready(function() {
   $('#example').DataTable();
});

Ajax表单：请注意，此表单在colorbox popup中加载

if (error == false) {
    $.post("submit.php", $("#add_note").serialize(), function (result) {
        if (result == 'success') {
            $('#error_msg').remove();
            $('#success_msg').fadeIn(500);
            // want to reload DataTables here
        } else {
            $('#error_msg').fadeIn(500);
        }
    });
}

我的解决方案：我尝试了不同的方法，下面的方法只刷新页面内容，但这是第一次。如果我想第二次提交表单而不刷新页面，那么ajax表单就会停止工作。

$(".content-wrapper").load('test.php');

Answer 1

如果您通过ajax option（我建议针对此特定情况）加载DataTables，您可以使用API重新加载其数据。

首先，将DataTables实例保存在全局变量中，然后使用这样的变量调用API：

var table;
$(document).ready(function() {
   table = $('#example').DataTable();
});

if (error == false) {
    $.post("submit.php", $("#add_note").serialize(), function (result) {
        if (result == 'success') {
            $('#error_msg').remove();
            $('#success_msg').fadeIn(500);
            table.ajax.reload();
        } else {
            $('#error_msg').fadeIn(500);
        }
    });
}

希望它有所帮助！

在colorbox中提交表单后重新加载dataTable

1 个答案: