Question

我正在使用MVC5，我最初通过迭代我的模型数据来加载我的数据表，手动构建表元素在文档就绪时我将表初始化为.datatable（）。这部分工作正常。现在，我允许我的用户更改他们想要显示的数据（通过下拉选择，更改事件触发并调用AJAX控制器方法，返回JSON对象），但dataTable的新初始化似乎并不想要合作。在这一点上什么都看不见。

在我看来，这是我的表格：

  <table class="table table-bordered" id="accountRequestStatus" name="accountRequestStatus">
                    <thead>
                        <tr>
                            <th>Col1</th>
                            <th>Col2</th>
                            <th>Col3</th>
                            <th>Col4</th>
                            <th>Col5</th>
                            <th></th>
                        </tr>
                    </thead>
                    <tbody>
                        @foreach (var request in Model.PayLoad)
                        {
                            <tr class="registerRow" id="register@(request.Col1)">
                                <td class="value registerRow">@request.Col2</td>
                                <td class="value registerRow">@request.Col3</td>
                                    <td class="value registerRow">@request.Col4</td>
                                    <td class="value registerRow">@request.EmailAddress</td>
                                <td>@Html.ActionLink("Click Me, Bro", ControllerMethod, new { param1 = request.MyParam1 })</td>
                            </tr>
                        }
                    </tbody>
                </table>

文件就绪：

 $(document).ready(function () {
    // Setting the filter button status to the selected value

    $('#accountRequestStatus').dataTable();});

BAM。这一切都很顺利，谢谢你！

现在，当我尝试使用即使只有一列重新加载网格时，我总是得到“无法重新初始化数据表”＃39;当我使用单个列时，我将我的视图表修改为只有1。

我的原始示例有4-5列，但在我的测试表中，我已将其删除到单个列。以下我特意（我认为）将列连接到数据（并添加名称）。 click事件调用LoadDataTable函数，如下所示。

  function LoadDataTable(data) {        

    $('#accountRequestStatus').dataTable(
        {
            paging: false,
            "data": data,
            "columns": [
               {
                   "data": "CompanyName",
                   "name": "BLAH BLAH"
               }
            ]
        }
    );}

从上面看，我似乎完全重新初始化了这张桌子。我想这样做，还是应该使用别的东西？

以下是我从开发人员工具中复制的一些单列示例数据：

enter image description here

你能看到我做错什么吗？在这一点上，我想完成我已经开始的方式，所以我可以称之为“好”。任何帮助表示赞赏！

Answer 1

使用destroy：

像往常一样初始化新的DataTable，但是如果存在则与选择器匹配的DataTable，它将被销毁换成新表。

$('#accountRequestStatus').dataTable(
    {
       destroy : true, //<-- here
       paging: false,
       "data": data,
       "columns": [
           {
               "data": "CompanyName",
               "name": "BLAH BLAH"
           }
        ]
    }
);}

jQuery DataTable刷新数据 - 首先是MVC View构建表，然后尝试显示通过ajax检索的数据

1 个答案: