2017-04-11 5 views
0

これはしばらくの間苦労しています。私のデータテーブルを移入するために取得しようとしますが、次のエラーに実行しています:私は行方不明です何かがなければならないので、私が言うことができるようにデータテーブルAJAXリクエスト - 不明な長さ

Uncaught TypeError: Cannot read property 'length' of undefined 
    at jquery.dataTables.min.js:48 
    at i (jquery.dataTables.min.js:35) 
    at Object.success (jquery.dataTables.min.js:35) 
    at i (jquery-3.1.1.min.js:2) 
    at Object.fireWith [as resolveWith] (jquery-3.1.1.min.js:2) 
    at A (jquery-3.1.1.min.js:4) 
    at XMLHttpRequest.<anonymous> (jquery-3.1.1.min.js:4) 

すべてが適切にフォーマットされます。何か飛び出すことはありますか?

$('#myGrid').DataTable({ 
     ajax: '/populatecardata', 
     dataSrc: 'data', 
     columns: [ 
      { data:"CarPrefix" }, 
      { data: "CarNumber" }, 
      { data: "CarDesc" }, 
      { data: "CarScreenDesc" }, 
      { data: "CarSummaryDesc" }, 
      { data: "CarColorDesc" }, 
      { data: "CarCodeComputed" }, 
      { data: "CarStatusDesc" } 
     ] 
    }); 

私のコントローラ

Route("populatecardata"), HttpGet] 

     public object getTableData() 
     { 

       using (CarEntities ce = new CarEntities()) 
       { 

       PopulateData pd = new PopulateData(); 
       var resultsList = pd.GetTableData(ce);    
       return resultsList; 

       } 


     } 

とデータをプルする私の方法:

ここ

は、ここに私のHTMLのサンプル

<table id="myGrid" class="table"> 
        <thead> 
         <tr> 
          <th>CarPrefix</th> 
          <th>CarNumber</th> 
          <th>CarDesc</th> 
          <th>CarScreenDesc</th> 
          <th>CarSummaryDesc</th> 
          <th>CarColorDesc</th> 
          <th>CarCodeComputed</th> 
          <th>CarStatusDesc</th> 
         </tr> 
        </thead> 

は私のAJAX要求であります

public object GetTableData(CarEntities ce) 
     { 
       Data ltr = new Data(); 
       resultsList = ce.CarData.Take(1).ToList(); 
       foreach(var result in resultsList) 
      { 
       TableResults tr = new TableResults(); 
       tr.CarPrefix = result.CarPrefix; 
       tr.CarNumber = result.CarNumber; 
       tr.CarDesc = result.CarDesc; 
       tr.CarScreenDesc = result.CarScreenDesc; 
       tr.CarSummaryDesc = result.CarSummaryDesc; 
       tr.CarColorDesc = result.CarColorDesc; 
       tr.CarCodeComputed = result.CarCodeComputed; 
       tr.CarStatusDesc = result.CarStatusDesc; 
       tr.CarStatusDesc = "TestStatus"; 
       ltr.jsondata.Add(tr); 

      } 
      var jsonObject = JsonConvert.SerializeObject(ltr); 
      return jsonObject; 

     } 

     public class Data 
     { 
      [JsonProperty("data")] 
      public List<TableResults> jsondata { get; set; } 
      public Data() 
      { 
       jsondata = new List<TableResults>(); 
      } 
     } 




     public class TableResults 
     { 
      [JsonProperty("CarPrefix")] 
      public string CarPrefix { get; set; } 

      [JsonProperty("CarNumber")] 
      public string CarNumber { get; set; } 

      [JsonProperty("CarDesc")] 
      public string CarDesc { get; set; } 

      [JsonProperty("CarScreenDesc")] 
      public string CarScreenDesc { get; set; } 

      [JsonProperty("CarSummaryDesc")] 
      public string CarSummaryDesc { get; set; } 

      [JsonProperty("CarColorDesc")] 
      public string CarColorDesc { get; set; } 

      [JsonProperty("CarCodeComputed")] 
      public string CarCodeComputed { get; set; } 

      [JsonProperty("CarStatusDesc")] 
      public string CarStatusDesc { get; set; } 


     } 
    } 

とサンプルJSONオブジェクト:

{ 
    "data": [ 
     { 
      "CarPrefix": "ty", 
      "CarNumber": "1009", 
      "CarDesc": "Toyota 2009 4Cylinder FWD", 
      "CarScreenDesc": "4CY-Toyota", 
      "CarSummaryDesc": "Toyota 2009", 
      "CarColorDesc": "Red", 
      "CarCodeComputed": "ty1009", 
      "CarStatusDesc": "Available" 
     } 
    ] 
} 
+0

@Bindridのおかげで助けになりました。私はこれを考え出した。私が実際にJSONを2回シリアライズしていたと言うのは恥ずかしいことです。JSONフォーマッタは分かりやすいほど精巧でしたが、私の脳はそうではありませんでした。 – PaulGlass

答えて

0

で行くことができるので、しかし、はdatasrcデフォルトは「データ」でありますこれは、間違っていることに対するよりよい感触を得るためのこの方法です:

0

あなたのDataTable構文は少し離れています。

$('#myGrid').DataTable({ 
    ajax:{url: '/populatecardata', 
      dataSrc: 'data'}, 
    columns: [ 
     { data:"CarPrefix" }, 
     { data: "CarNumber" }, 
     { data: "CarDesc" }, 
     { data: "CarScreenDesc" }, 
     { data: "CarSummaryDesc" }, 
     { data: "CarColorDesc" }, 
     { data: "CarCodeComputed" }, 
     { data: "CarStatusDesc" } 
    ] 
}); 

あなたが実際にあなたがクロムまたはIEのデバッガでデバッガコマンドを使用する方法を知っている場合は、あなたが行うことができ、それをドロップし、

$('#myGrid').DataTable({ 
    ajax: '/populatecardata', 

    columns: [ 
     { data:"CarPrefix" }, 
     { data: "CarNumber" }, 
     { data: "CarDesc" }, 
     { data: "CarScreenDesc" }, 
     { data: "CarSummaryDesc" }, 
     { data: "CarColorDesc" }, 
     { data: "CarCodeComputed" }, 
     { data: "CarStatusDesc" } 
    ] 
}); 
関連する問題