帶MVC的jQuery數據表問題

Question

當使用Datatables和MVC時，出現錯誤Requested unknown parameter '0' for row 0, column 0。

我的使用情況是，我想從一個MVC控制器返回JSON數據，但我很好的保留所有的排序功能分頁的客戶機上，我將永遠只能返回大約100行

我的代碼是如下圖所示：

public ActionResult LoadCarData() 
{ 
    // will really come from DB just mocked for now 
    var carData = new List<CarData>(new[] 
    { 
      new CarData { DT_RowId = "row_1", // will really have a CarId in the DB and I want to concatenate that to make each row have the id from the db 
          Manufacturer = "BMW", 
          Model = "3 Series", 
          Colour = "Red", 
          EngineSize = 3.0M, 
          }, 
      new CarData { DT_RowId = "row_2", 
          Manufacturer = "Mercedes", 
          Model = "C Class", 
          Colour = "White", 
          EngineSize = 2.5M, 
          }, 
      new CarData { DT_RowId = "row_3", 
          Manufacturer = "Audi", 
          Model = "A5", 
          Colour = "Black", 
          EngineSize = 2.0M, 
          } 
     }); 

    return Json(new 
    { 
    aaData = carData 
    }, JsonRequestBehavior.AllowGet); 
} 

我CarData類如下：

public class CarData 
    { 
    public string DT_RowId { get; set; } 
    public string Manufacturer { get; set; } 
    public string Model { get; set; } 
    public string Colour { get; set; } 
    public decimal? EngineSize { get; set; } 
    } 

我有一個AJAX調用我的MVC控制器如下（注意在第一列數據表是一個複選框，允許用戶選擇該行：

$.ajax({ 
     url: '@Url.Action("LoadCarData", "Car")', 
     type: 'GET', 
     dataType: 'json', 
     success: function (data) { 
      console.log(data); 
      $('#carData').dataTable({ 
      bProcessing: true, 
      aaData: data.aaData, 
      columnDefs: [ 
       { orderable: false, className: 'select-checkbox', targets: 0 }, 
      ], 
      select: { 
       style: 'multi', 
       selector: 'td:first-child' 
      }, 
      order: [[1, 'asc']] 
      }); 
     } 
     }); 

我的表HTML是如下：

<table id="carData" class="display" cellspacing="0" style="width:100%"> 
    <thead> 
    <tr> 
     <th></th> 
     <th>Manufacturer</th> 
     <th>Model</th> 
     <th>Colour</th> 
     <th>EngineSize</th> 
    </tr> 
    </thead> 
    <tbody> 
    <tr> 
     <td></td> 
     <td></td> 
     <td></td> 
     <td></td> 
     <td></td> 
    </tr> 
    </tbody> 
</table> 

最後，在DevTools的網絡選項卡中鉻，我可以看到返回的JSON數據如下：

{ 
    "aaData": [{ 
     "DT_RowId": "row_1", 
     "Manufacturer": "BMW", 
     "Model" = "3 Series", 
     "Colour": "Red", 
     "EngineSize": 3.0, 
    }, { 
     "DT_RowId": "row_2", 
     "Manufacturer": "Mercedes", 
     "Model" = "C Class", 
     "Colour": "White", 
     "EngineSize": 2.5, 
    }, { 
     "DT_RowId": "row_3", 
     "Manufacturer": "Audi", 
     "Model" = "A5", 
     "Colour": "Black", 
     "EngineSize": 2.0, 
    }] 
} 

有沒有什麼我做錯了，以便正確輸出rowId作爲來自數據庫呈現的每一行？

Answer 1

我是初學者，只是想幫忙。看看你是否至少得到表格數據。你可以試試下面片段：

$.ajax({ 
    url: '@Url.Action("LoadCarData", "Car")', 
    type: 'GET', 
    dataType: 'json', 
    success: function (data) { 
     console.log(data); 
     $('#carData').dataTable({ 
     columns: [ 
      { data: "data.aaData" } 
     ] 
     }); 
    } 
    }); 

或者類似下面

嘗試用下面

attempt 1: data: "data.aaData.Model" 
attempt 2: data : "aaData.Model" 
attempt 3: data : "aaData"