javascript - jQuery Datatables 从服务器加载数据

Question

我使用asp.net mvc，想要从服务器端加载json数据。我有一段服务器端代码:

Function GetData() As ActionResult

            Dim TransactionSearchRow1 = New TransactionSearchRow With {
            .status = Status.Cancelled,
            .transactinId = 12345,
            .creditCardNumber = "1234324324",
            .supplier = "Office Depot",
            .createdAt = New DateTime(2008, 12, 28),
            .amount = 500
            }

            Dim TransactionSearchRowJson = JsonConvert.SerializeObject(TransactionSearchRow1)

            Return Json(TransactionSearchRowJson)

        End Function

它只是从 TransactionSearchRow 对象发回 json 字符串。

我有客户端代码:

$("#searchBTN").on("click", function () {
                $.ajax({
                    url: '/Transaction/GetData',
                    method: 'POST',
                    dataType: 'json',
                    success: function (data) {
                        $('#TransactionTable').dataTable({
                            data: data,
                            columns: [
                                { 'data': 'status' },
                                { 'data': 'transactinid' },
                                { 'data': 'creditcardnumber' },
                                { 'data': 'supplier' },
                                { 'data': 'createdAt' },
                                { 'data': 'amount' }
                            ]

                        });

                    }
                });
            });

和简单的 HTML 表格:

<table id="TransactionTable" class="table table-striped table-bordered table-list">
                    <thead>
                        <tr>
                            <th class="col-md-1">Status</th>
                            <th>TransID</th>
                            <th>CCN</th>
                            <th>Supplier</th>
                            <th>Created Date</th>
                            <th>Amount</th>
                        </tr>
                    </thead>

                    <tbody>

                    </tbody>
                </table>

JSON 响应:

但是当我单击“搜索”按钮时出现错误。

Answer 1

我认为您的响应数据格式不正确。请引用此example ajax响应应该是一个具有名为“data”的数组属性的对象。我对 VB 不熟悉，所以我给你 C# 代码片段。更改您的服务器端操作代码，如下所示:

 return Json(new {
        data: new List<TransactionSearchRow>(){TransactionSearchRow1}
    })