Question

我正在使用jQuery DataTables，这是我目前的表格：

现在，当我点击Deactivate时，我正在使用ajax调用我的WebApi方法将该记录设置为active = false ..因此应该取消选中表中的复选框。

public IHttpActionResult Deletecode_AutoMake(int id)
{
    code_AutoMake code_AutoMake = db.code_AutoMake.Find(id);
    if (code_AutoMake == null)
    {
        return NotFound();
    }

    code_AutoMake.Active = false;
    db.Entry(code_AutoMake).State = EntityState.Modified;
    db.SaveChanges();

    return Ok(code_AutoMake);
}

这一切都按预期工作..但表格没有重新加载，除非我刷新页面以查看实际未选中的复选框。

以下是我的DataTable的设置方式。

$("#Auto-Make-Table").on("click",
    ".js-automake-delete",
    function () {

        var link = $(this);
        var autoMakeName = $(this).data("automake-name");
        var autoMakeId = $(this).data("automake-id");

        bootbox.confirm("Are you sure you want to delete this auto make?",
            function (result) {
                if (result) {
                    $.ajax({
                        url: infoGetUrl + autoMakeId,
                        method: "DELETE",
                        success: function () {
                            autoMakeTable.reload();
                            toastr.success(autoMakeName + " successfully deleted");
                        },
                        error: function (jqXHR, textStatus, errorThrown) {
                            var status = capitalizeFirstLetter(textStatus);
                            var error = $.parseJSON(jqXHR.responseText);
                            console.log(error);
                            toastr.error(status + " - " + error.exceptionMessage);
                        }
                    });
                }
            });
    });

我的问题/目标是..如何在没有实际页面刷新的情况下让表刷新/重新加载？

感谢任何帮助。

更新

尝试使用autoMakeTable.ajax.reload();

收到此错误：

接下来是这个：

Answer 1

假设您的数据表是这样分配的，

var myDataTable = $('#myTableId').DataTable({
  //Rest code
 })

然后在你的success method内停用，你只需要像这样重新加载你的数据，

 success: function()
 {
  myDataTable.ajax.reload();
  //rest code
 }

您忘了添加 ajax 。请查看此official link了解详情。

<强>更新：

如果您的部分视图为strongly typed，请在成功方法中调用您的操作方法并进行渲染，例如，在您的上述成功方法中，

success: function()
 { 
   $.ajax({ 
       url: "@Url.Action("Index", "code_AutoMake")", //As you have mentioned in the chat
       method: "GET",
       success: function (data) 
        { 
         //Here just render that partial view like 
         $("#myDiv").html('').html(data); //This will empty first then render the new data
        }
      })

注意：此处 myDiv 是id的{{1}}，您的表位于此处。

希望有所帮助：）

Answer 2

在你的php文件或它可能是哪个文件中创建一个与你当前的html结构相同的html结构的表，而不是你通过执行ajax调用获得的新数据。

$.post( "newTable.php", function( data ) {
     $( ".currentTable" ).html( data );
});

jquery DataTables重新加载而不刷新页面

2 个答案: