DataTables - 在 7 列中的 3 列上请求了未知参数

Question

我对这个问题束手无策，希望有人能提供帮助。我仔细阅读了所有其他答案，none 所提供的解决方案解决了我的问题。以下是 JSON 字符串：

{
  Description="XT86 EXTENDED WARRANTY (3 YEARS)",
  Id=88,
  InternalPartNumber="000-063",
  ManufacturerPartNumber="000-063",
  SellPrice=350.00,
  Cost=280.00,
  Category="Maintenance"
}

以下是我的JS：

 $('#products').dataTable({
            serverSide: true,
            ajax: {
                url: "/Product/LoadProducts",
                type: "POST",
                datatype: "json"
            },
            columns: [
                { data: "id" },
                { data: "internalpartnumber" },
                { data: "manufacturerpartnumber" },
                { data: "description" },
                { data: "category" },
                { data: "sellprice" },
                { data: "cost" }
            ]
        });

HTML如下：

<div class="shadow-lg p-1 mb-1 bg-secondary rounded">
    <table class="table table-hover table-striped table-bordered table-sm w-100" id="products">
        <thead class="bg-primary">
            <tr style="cursor:pointer;" class="text-light">
                <th scope="col">Id</th>
                <th scope="col">DCT Part #</th>
                <th scope="col">MFG Part #</th>
                <th scope="col">Description</th>
                <th scope="col">Category</th>
                <th scope="col">Sell Price</th>
                <th scope="col">Cost</th>
            </tr>
        </thead>
    </table>
</div>

结果如下：

DataTables warning: table id=products - Requested unknown parameter 'internalpartnumber' for row 0, column 1. For more information about this error, please see http://datatables.net/tn/4

在错误上单击确定确实加载了 table 但 3 列缺少数据。

我尝试删除 { data: "internalpartnumber" } 但后来我收到关于 ManufacturingPartNumber 的错误。当我删除 { data: "manufacturerpartnumber" } 时，我在 SellPrice 上收到错误消息。当我删除 { data: "sellprice" } 时，我没有收到任何错误！

当我查看来自 Visual Studio 的数据时，数据的顺序与我对每个“索引”顺序的顺序相同，但是当您展开每个行索引时，它正在排序。

如能提供任何帮助，我们将不胜感激。

LoadProducts方法如下：

 var results = (from p in _productRepository.GetAllActive
                           select new
                           {
                               p.Id,
                               p.InternalPartNumber,
                               p.ManufacturerPartNumber,
                               p.Description,
                               Category = p.ProductCategory.Display,
                               p.SellPrice,
                               p.Cost
                           });

Answer 1

您的 DataTable 中的列未按照数据的顺序设置

HTML

<table id="products" class="display" style="width:100%">
  <thead>
    <tr>
      <th>Description</th>
      <th>Id</th>
      <th>InternalPartNumber</th>
      <th>ManufacturerPartNumber</th>
      <th>SellPrice</th>
      <th>Cost</th>
      <th>Category</th>
    </tr>
  </thead>
</table>

Jquery

        var ret = {
        data: [
            {
                Description: "XT86 EXTENDED WARRANTY (3 YEARS)",
                Id: 88,
                InternalPartNumber: "000-063",
                ManufacturerPartNumber: "000-063",
                SellPrice: 350.00,
                Cost: 280.00,
                Category: "Maintenance"
             }
         ]
     };

    $('#products').dataTable({
        data: ret.data,
        columns: [
            { data: "Description" },
            { data: "Id" },
            { data: "InternalPartNumber" },
            { data: "ManufacturerPartNumber" },
            { data: "SellPrice" },
            { data: "Cost" },
            { data: "Category" }
        ]
    });

Answer 2

我终于弄明白了。在 Chrome 中，我选择了开发人员工具下的网络选项来检查负载。我注意到列的第一个字母是小写的，这与 Visual Studio 显示的不同。

我将列定义更新为以下内容：

 columns: [
                    { data: "id", name: "id", autoWidth: true },
                    { data: "internalPartNumber", name: "internalPartNumber", autoWidth: true },
                    { data: "manufacturerPartNumber", name: "manufacturerPartNumber", autoWidth: true },
                    { data: "description", name: "description", autoWidth: true },
                    { data: "category", name: "category", autoWidth: true },
                    { data: "sellPrice", render: $.fn.dataTable.render.number(',', '.', 2, '$') },
                    { data: 'cost', render: $.fn.dataTable.render.number(',', '.', 2, '$') }
                ]

现在一切正常。

DataTables - 在 7 列中的 3 列上请求了未知参数

DataTables - Requested unknown parameter on 3 of 7 Columns

datatables-1.10