Question

我有一个使用DataTables jquery库的MVC 5应用程序。我以前使用过这个，但是在页面加载时总是立即加载表。目前，我希望页面加载并允许用户将文本添加到搜索字段，调用AJAX函数，然后显示返回的数据。

我收到的错误是'未捕获的TypeError：在页面加载时无法读取属性'nTable'of null'。

到目前为止，我发现了一些错误：返回的数据太多，而且预期返回的订单错误。这些是固定的，但我仍然得到同样的错误。

我知道我的AJAX方法会返回数据，而且我知道我的点击事件正在触发。

这是我的客户端代码，快速下降：我有一个公共'sf'变量来容纳数据表实例（.DataTable，而不是.dataTable）。然后我设置表，没有数据字段。当用户单击搜索按钮时，ajax方法将触发，检索数据（使用Fiddler验证），并在success方法中调用函数将这些行添加到表中。

<script>
var sf;

$(document).ready(function () {       
    SetupSalesForceTable();
});

function SetupSalesForceTable() {

    sf = $('#salesForceAccounts').DataTable(
        {
            "destroy": true
            , "processing": true
            , "columns": [
                { "data": "Id" },
                { "data": "AccountNumber" },
                { "data": "Name" }
            ]
        });
}

function LoadSalesForceSearchData() {
    var search = $("#salesForceSearch").val();

    $.ajax(
    {
        "type": "GET"
        , "data": { search: search }
        , "url": "@Url.Action(MyMethod, MyController)"
        , success: function (data) { AddRecordsToTable(data); }
        , error: function () { alert('there was an error! '); }
    });
}

function AddRecordsToTable(data) {

    sf.rows.add(data).draw();
    $("#salesForceAccounts").show();
} </script>

正如我所说的，之前我曾使用过DataTables，但是所有内容都被放入了页面加载中，并且工作正常。这一次，事情有点不同，我不确定我错过了什么。我是否缺少任何必需的部件，或者配置错误？谢谢你的帮助！

Answer 1

Arrrrg ...从我询问/了解数据和dataSrc的另一个问题here，我意识到我的单独ajax调用创建了一个包围我的数据的包装器，并且比我分配的级别更深。糟糕！

这是我的AJAX控制器方法所做的事情（不，这些不是我使用的真实方法名称），而且我只返回一组对象。这有效！

 [RequireAjax]
    [HttpGet]
    public ActionResult LoadSalesForceSearchTable(string search)
    {
        var model = this.MyRepo.MyMethod(search);

        var json = this.Json(model, JsonRequestBehavior.AllowGet);            

        return json;
    }

以下不适用于我的DataTables对象设置方式。最初，我这样做是为数据添加一个包装器，称为数据＆＃39;我需要的方式是我使用以前的数据表。因为我的数据比我指定的要深一级，所以我什么都没得到。

 [RequireAjax]
    [HttpGet]
    public ActionResult LoadSalesForceSearchTable(string search)
    {
        var model = this.MyRepo.MyMethod(search);

        var json = this.Json(new { data = model}, JsonRequestBehavior.AllowGet);

        return json;
    }

希望这能帮到你！

使用ajax数据在onclick上加载jQuery DataTables

1 个答案: