JQuery Datatable没有从MVC Controller加载Json数据

时间:2018-03-28 13:00:04

标签: json ajax asp.net-mvc datatables

我有一个 Asp.Net MVC 5 Web应用程序。我正在使用 JQuery Datatables v1.10.16 来显示其中一个剃刀视图中的表格数据。返回到数据表的数据是通过 ajax调用并返回 Json

这是我的剃刀观点

<table id="data_table" class="display" style="width:100%">
    <thead>
        <tr>
            <td>Evaluation ID</td>
            <td>Applicant Name</td>
        </tr>
    </thead>
    <tfoot>
        <tr>
            <td>Evaluation ID</td>
            <td>Applicant Name</td>
        </tr>
    </tfoot>
</table>

<script type="text/javascript">
    $(document).ready(function () {

        $('#data_table').DataTable({
            "ajax": '/EvalDashboard/GetEvaluationData',
            "dataSrc": 'evaluations',
            "columns": [
            { data: 'evaluationID' },
            { data: 'applicantName' }
            ]
        });

    });
</script>

这是我在控制器EvalDashboard

中调用的方法
    public JsonResult GetEvaluationData()
    {

        var evaluations = _evalService.GetAllCecEvaluations(null, null)
            .Take(20).Select(x => new
            {
                evaluationID = x.EvaluationID,
                applicantName = x.tblcourseapplicant.FullName
            }).ToList();

        return Json(evaluations, JsonRequestBehavior.AllowGet);
    }

当我运行应用程序时,我可以看到正在调用方法GetEvaluationData(),但是,没有数据返回到视图中的数据表,我只收到一条消息说正在加载...

我不确定问题是否是因为我在我的方法中返回了一个匿名类型。

有人可以帮忙吗?

感谢。

2 个答案:

答案 0 :(得分:1)

我认为您需要做的只是以下

</script>
$(document).ready(function () {
    $('#example').dataTable({
        "ajax": "/Home/Index",
         "columns": [
                    { "data": "FirstName" },
                    { "data": "LastName" },
                    { "data": "Username" },
                    { "data": "Password" },
                    ]
    });
});
</script>

不需要处理和服务器端,当你有大量数据并希望在服务器端完成分页和排序时使用它们,而代码中并非如此

答案 1 :(得分:0)

问题是我没有在Json return语句中包含关键字data,如下所示:

return Json(new { data = evaluations }, JsonRequestBehavior.AllowGet);

这解决了我遇到的问题。