获取C#datatable的Json字符串并在jquery Datatable中显示

时间:2018-03-18 10:51:15

标签: javascript jquery json asp.net-mvc datatables

主要的是我是Jquery Datatable的新手,从过去2天开始,我尝试使用它,使用json字符串。但我没有要求输出。

这是我的HTML:

 <body>
    <div class="container">
        <table id="MydataTableDiv">
            <thead>
              <tr>
               <th>NAME</th>
               <th>MARKS</th>
              </tr>
            </thead>
        </table>
    </div>
</body>

这是我的剧本:

 $(document).ready(function () {
    $("#MydataTableDiv").DataTable({
        serverSide: true,
        processing: true, 
        ajax: {
            "url": "../Home/GetData",
            "dataSrc":''
        },
        columns: [
            { data: "NAME" },
            { data: "MARKS" }
        ],
    });
});

最后,  我的家庭控制器:

public JsonResult GetData()
    {
        DataTable _dt = new DataTable();

        _dt.Columns.Add("NAME");
        _dt.Columns.Add("MARKS");

        for (int i = 0; i < 10; i++)
        {
            DataRow _dr = _dt.NewRow();
            _dr["NAME"] = "A_" + i;
            _dr["MARKS"] = i * 10;
            _dt.Rows.Add(_dr);
        }

        string JsonResult = JsonConvert.SerializeObject(_dt);
        return Json(new {data=JsonResult }, JsonRequestBehavior.AllowGet);
    }

这是我从控制器返回的Json字符串:

[{"NAME":"A_0","MARKS":"0"},{"NAME":"A_1","MARKS":"10"},{"NAME":"A_2","MARKS":"20"},{"NAME":"A_3","MARKS":"30"},{"NAME":"A_4","MARKS":"40"},{"NAME":"A_5","MARKS":"50"},{"NAME":"A_6","MARKS":"60"},{"NAME":"A_7","MARKS":"70"},{"NAME":"A_8","MARKS":"80"},{"NAME":"A_9","MARKS":"90"}]

此代码为我提供了一个空白的空表,其中包含所有分页,过滤选项。 请帮我解决上面代码中的错误,或者是否有其他方法将其用于动态数据。

1 个答案:

答案 0 :(得分:1)

根据我的观察,数据表需要一个JSON对象而不是一个字符串。您正在返回一个可以转换为JSON的字符串。

对你的ajax电话做了一些小改动

ajax: {
            url: "http://localhost:21594/api/values",
            "dataSrc": function ( json ) {
                return JSON.parse(json);
            }    
        },

上面将您作为字符串返回的数据转换为数据表理解的JSON