asp.net 如何在不调用 AJAX 的情况下获取DataTable数据以加载JSON?

ehxuflar  于 2022-11-26  发布在  .NET
关注(0)|答案(1)|浏览(111)

我正在使用DataTables,尝试加载json数据。HTML呈现良好,但无法显示任何数据。实时数据不起作用,因此我创建了一个字符串来模拟返回。我没有进行 AJAX 调用来获取数据,我在C#中调用端点,并将产生的json字符串传递给JS。我在控制台中没有得到任何错误。如果你想知道我为什么要“我没有使用 AJAX ,我会说我不知道。:-)
我们刚刚下载了DataTables,所以它是最新版本,项目是.Net Framework 4.6.1
下面是我的Json:

var fakeJson =
         {
             "data":
             {
                 "Triggers": {
                     "TriggerTypeId": 2,
                     "TriggeredKeyId1": 499,
                     "TriggerHelpText": "Blah blah blah",
                     "TriggerActionDefinitionID": 2,
                     "ComparisonOperatorID": 1
                 },
                 "Action": {
                     "TaDescription":"this is an action description"
                 },
                 "Protocols": {
                     "protocolDescription": "this is a protocol description"
                 },
                 "Operators": {
                     "CODisplayText": "="
                 }
             }
         };

下面是我JS:

var dataSource = <%= DataTableJson %>;
         dataString = JSON.stringify(dataSource);
         dataSource = JSON.parse(dataString);

         console.log(fakeJson.data.Triggers.TriggerHelpText);

        var editor = new $.fn.dataTable.Editor({
            table: '#ProtocolTriggerTable',
            "data": fakeJson
            },

            fields: [{
                label: "Comparison",
                name: "data.Operators.CODisplayText",
                //type: "select"
             }, {
                label: "Action",
                name: "data.Action.TaDescription",
                //type: "select"
            }, {
                label: "Item",
                name: "data.Protocols.protocolDescription",
                //type: "select"
            }, {
                label: "Pop-up Text",
                    name: "data.Triggers.TriggerHelpText",
                //type: "select"
            }]
        });

         $('#ProtocolTriggerTable').DataTable({
             dom: "rt",
             data: fakeJson,
             columns: [
                 { data: "data.Operators.CODisplayText" },
                 { data: "data.Action.TaDescription" },
                 { data: "data.Protocols.protocolDescription" },
                 { data: "data.Triggers.TriggerHelpText" }
             ],

         });

和HTML

<table border="1" id="ProtocolTriggerTable" class="display" style="background-color: #e0e0e0; width:100%;">
    <thead>
        <tr>
            <th style="width:20px !important"></th> 
            <th>Comparison</th>
            <th>Action</th>
            <th>Item</th>
            <th>Pop-up Text</th>
        </tr>
    </thead>
</table>

**后续:**基于下面两三条不错的评论,这是最终起作用的Json结构。不,我只需要将它应用到我的实时数据中。

var fakeJson =
            [{
                "Triggers": {
                    "TriggerTypeId": 2,
                    "TriggeredKeyId1": 499,
                    "TriggerHelpText": "Blah blah blah",
                    "TriggerActionDefinitionID": 2,
                    "ComparisonOperatorID": 1
                },
                "Action": {
                    "TaDescription": "this is an action description"
                },
                "Protocols": {
                    "protocolDescription": "this is a protocol description"
                },
                "Operators": {
                    "CODisplayText": "="
                }
            }];
b5lpy0ml

b5lpy0ml1#

DataTableJson的格式不可用请尝试以下操作:

[
    ['Comparison0', 'Action0', 'Item0', 'Popup0'],
    ['Comparison1', 'Action1', 'Item1', 'Popup1'],
]

相关问题