datatables.net ajax error - http://datatables.net/tn/7

datatables.net ajax error - http://datatables.net/tn/7

本文关键字:net datatables tn ajax error http      更新时间:2023-09-26

我正试图遵循一个示例,使用基于此示例的JSON响应将数据添加到datatables.net数据表https://www.datatables.net/examples/ajax/objects.html.

我正在使用AJAX调用从数据库中获取JSON响应。

我正在获取数据,然后根据下面的代码使用NewtonSoft JSON.Net将数据表转换为JSON数组

string jsonResult = null;
jsonResult = Newtonsoft.Json.JsonConvert.SerializeObject(dt);
jsonResult = jsonResult.Replace("[{", "{'"data'" :[{").Replace("}]", "}]}");
return jsonResult;

根据下一个代码片段,这是从一个单独的javascript文件中的AJAX调用中成功调用的

 $.ajax({
            type: "POST",
            url: "TeamChecks.aspx/GetDataTables",
            data: JSON.stringify(params),
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function (data) {
                console.log(data.d);
                populateTable(data.d, tableId);
            },
            error: function (data) {
                console.log(data);
            }
        }

然后将返回的值传递给一个函数,该函数应根据下一组代码将数据相应地格式化并输入数据表

function populateTable(json, tableId) {
        try {
            var table = $('#table_' + tableId).DataTable({
                "processing": true,
                "serverSide": true,
                "ajax": json,
                "columns:": [
                    { "data": "CaseHandlerStaffNumber" },
                    { "data": "RiskProfileText" },
                    { "data": "AssignedCheckerStaffNumber" },
                    { "data": "FeedbackUserStaffNumber" },
                    { "data": "ComplaintRef" },
                    { "data": "ChildComplaintRef" },
                    { "data": "CaseTypeText" },
                    { "data": "CheckGrade" }
                ]
            });
        } catch (e) {
        }
    }

我遇到的问题类似于这里的这个问题jquery datatables Ajax错误/http://datatables.net/tn/7然而,我已经尝试过这个用户解决方案,并遇到了同样的问题。

我已经遵循了这里详细介绍的所有建议步骤https://www.datatables.net/manual/tech-notes/7但不要认为与此相关的回复有任何错误。

如果有人能帮助我,我将不胜感激,因为我目前看不到解决这个问题的方法

感谢

Simon

基本上,当您有一个ajax调用来获取数据,然后将ajax添加到数据表定义中时,您就是在与自己作对。

建立web方法;请注意,当您这样做时,数据会被序列化两次,一次由您序列化,另一次由脚本服务模块序列化。

[WebMethod]
public string getTheData(String params){
    SomeDataClass dt = getthedata();
    return Newtonsoft.Json.JsonConvert.SerializeObject(dt);
} 

现在是ajax:

$(document).ready(function(){
    $.ajax({
        type: "POST",
        url: "TeamChecks.aspx/GetDataTables",
        data: JSON.stringify(params),
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function (response) {
            // jquery did the first deserialization
            // here is where the second deserization happens.
            var data = JSON.parse(reponse.d);
            populateTable(data, tableId);
        },
        error: function (data) {
            console.log(data);
        }
    }
 });

然后你的功能

function populateTable(json, tableId) {
        var table = $('#table_' + tableId).DataTable({
             // in this layout DataTables is expecting a straight array of objects or array of arrays depending on how you are sending the data back
            "data": json,
            "columns:": [
                { "data": "CaseHandlerStaffNumber" },
                { "data": "RiskProfileText" },
                { "data": "AssignedCheckerStaffNumber" },
                { "data": "FeedbackUserStaffNumber" },
                { "data": "ComplaintRef" },
                { "data": "ChildComplaintRef" },
                { "data": "CaseTypeText" },
                { "data": "CheckGrade" }
            ]
        });
  }