在表单提交后重新载入数据表colorbox

Question

我有一个页面test.php其中我使用jQuery DataTables获取数据。在同一页面中有一个“添加注释”按钮，可在colorbox内打开ajax窗体。表单提交工作正常，但我想在数据库中插入记录时刷新DataTable。

数据表：

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

阿贾克斯形式：注意颜色框弹出里面这种形式的负载

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（我建议你对这种特殊情况下），则可以使用API重新加载其数据。

首先，保持数据表的实例在一个全局变量，然后使用这些变量调用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); 
     } 
    }); 
} 

希望它能帮助！