将数据表中的所有字段返回到 AJAX答案

【问题标题】：Returning all field from Datatable to AJAX将数据表中的所有字段返回到 AJAX
【发布时间】：2020-02-04 21:56:02
【问题描述】：

我的问题是，在我输入文本并单击搜索按钮后，它不显示来自 c# 的表格。我尝试了很多方法，但它不起作用。下面是我的代码。

下面是我的javascript：

url: "/Testing/TraceReport/traceReport.aspx/app",
type: 'POST',
contentType: 'application/json; charset=utf-8',
dataType: 'json',    
success: function (response) {
    var xmlDoc = $.parseXML(response.d);
    var xml = $(xmlDoc);
    var EquipmentList = xml.find("Table1");
    var content = "";
    if (EquipmentList.length > 0) {
        $(EquipmentList).each(function () {
            content += "<tr align='center'>";

            if ($(this).find('Column1').text() == "") { content += "<td><b><font color='red'>UNKNOWN</font></b></td>"; }
            else { content += "<td><b>" + $(this).find('Column1').text() + "</b></td>"; }

            if ($(this).find('Column2').text() == "") { content += "<td><b><font color='red'>UNKNOWN</font></b></td>"; }
            else { content += "<td><b>" + $(this).find('Column2').text() + "</b></td>"; }

            if ($(this).find('Column3').text() == "") { content += "<td><b><font color='red'>UNKNOWN</font></b></td>"; }
            else { content += "<td><b>" + $(this).find('Column3').text() + "</b></td>"; }

            if ($(this).find('Column4').text() == "") { content += "<td><b><font color='red'>UNKNOWN</font></b></td>"; }
            else { content += "<td><b>" + $(this).find('Column4').text() + "</b></td>"; }

            if ($(this).find('Column5').text() == "") { content += "<td><b><font color='red'>UNKNOWN</font></b></td>"; }
            else { content += "<td><b>" + $(this).find('Column5').text() + "</b></td>"; }

            if ($(this).find('Column7').text() == "") { content += "<td><b><font color='red'>UNKNOWN</font></b></td>"; }
            else { content += "<td><b>" + $(this).find('Column7').text() + "</b></td>"; }

            content += "</tr>";
        });
    }

下面是我的c#：

DataTable table = new DataTable();
table = ConvertListToDataTable(list);
DataSet ds = new DataSet();
ds.Tables.Add(table);

return ds.GetXml();

【问题讨论】：

使用所有这些代码，请说明您在做什么以及最后想要实现的目标。
我想在点击按钮后显示表格。该表是从后端的数据集到 ajax。
在浏览器上打开Dev Tools (F12) 并检查控制台是否有任何错误。
它抛出空对象引用

标签： c# jquery asp.net ajax

【解决方案1】：

dataType 属性告诉服务器要返回什么类型的数据。

你告诉服务器你想接收json。然而，看起来服务器正在发送xml。更新ajax方法中的dataType：

...
dataType: 'xml', 
...

【讨论】：

【解决方案2】：

据我了解，您正在从 WebMethod 返回 DataTable 对象本身，并且您想从 column 读取所有返回的 rows。

这是我的建议，创建一个模型并将您的值从 DataTable 复制到 C# 类对象通用列表。思路如下：

// Sample Class
public class MyData
{
    public string Column1 {get; set;}
    public string Column2 {get; set;}
    public string Column3 {get; set;}
    public string Column4 {get; set;}
    // ... and so on
}

然后在你的WebMethod:

[WebMethod]
[ScriptMethod(ResponseFormat = ResponseFormat.Json)]  // To Force the service method to return JSON only
public static List<MyData> DoStuff()
{
    DataTable table = FetchMyTable(); // method that gets your data from SQL
    List<MyData> data = new List<MyData>();
    foreach(DataRow row in table.Rows)
    {
        MyData dataItem = new MyData
        {
            Column1 = row["Column1"].ToString(),
            Column2 = row["Column2"].ToString(),
            // And So on...
        };
        data.Add(dataItem);
    }
    return data;
}

然后在你的 ajax 调用中：

$.ajax({
// your other parameters
contentType: 'application/json; charset=utf-8;',
accept: 'application/json; charset=utf-8;',
dataType: 'json',
success: function(response){
        // Now from here you can loop through it
        for(var i = 0; i < response.length; i++){
            var column1 = response[i].Column1;
            var column2 = response[i].Column2;
            // and so on....
        }
    }
});

这是一个粗略的想法，如何完成您正在执行的任务。希望对您有所帮助。

PS：我没有使用任何编译器，所以代码没有经过测试，可能需要一些爱。

【讨论】：