jquery數據表與AJAX的json數據源

Question

我想從AJAX使用jQuery數據表的ASP.NET MVC的實體框架加載數據。不知何故數據沒有顯示在表格中。需要你的幫助來了解我哪裏出錯了。

當我在瀏覽器中執行的JSON它返回以下字符串

[{"Region1":"South2","RegionId":1}, 
{"Region1":"Ahmedabad","RegionId":2}, 
{"Region1":"Bangalore","RegionId":3}, 
{"Region1":"Bhubaneswar","RegionId":4}, 
{"Region1":"Bilshpur","RegionId":5}] 

的JSON代碼

public class RegionJSONController : ApiController 
{ 
    static azure_sociodataEntities1 ctx = new azure_sociodataEntities1(); 

    // GET: api/RegionJSON 
    public dynamic Get() 
    { 
      return ctx.Regions.Include("Tags").Select(i => new { i.Region1, i.RegionId }).Take(5); 
    } } 

的HTML頁面

  <table id="regionsdt" class="table table-striped table-bordered table-hover"> 
        <thead> 
         <tr> 
          <th>Region ID</th> 
          <th>Region</th> 
         </tr> 

        </thead> 
        <tbody></tbody> 
       </table> 

<<!-- DataTables CSS --> 
<link rel="stylesheet" type="text/css" href="//cdn.datatables.net/1.10.6/css/jquery.dataTables.css"> 

<!-- jQuery --> 
<script type="text/javascript" charset="utf8" src="//code.jquery.com/jquery-1.10.2.min.js"></script> 

<!-- DataTables --> 
<script type="text/javascript" charset="utf8" src="//cdn.datatables.net/1.10.6/js/jquery.dataTables.js"></script> 


    <script> 
    function InitOverviewDataTable() { 
     oOverviewTable = $('#regionsdt').dataTable(
     { 
      "bPaginate": false, 
      "bJQueryUI": true, // ThemeRoller-stöd 
      "bLengthChange": false, 
      "bFilter": false, 
      "bSort": false, 
      "bInfo": true, 
      "bAutoWidth": true, 
      "bProcessing": false, 
      "iDisplayLength": 10, 
      "sAjaxSource": 'http://localhost:44379/api/RegionJSON' 
     }); 
    } 

    function RefreshTable(tableId, urlData) { 
     $.getJSON(urlData, null, function (json) { 
      table = $(tableId).dataTable(); 
      oSettings = table.fnSettings(); 

      table.fnClearTable(this); 

      for (var i = 0; i < json.aaData.length; i++) { 
       table.oApi._fnAddData(oSettings, json.aaData[i]); 
      } 

      oSettings.aiDisplay = oSettings.aiDisplayMaster.slice(); 
      table.fnDraw(); 
     }); 
    } 

    function AutoReload() { 
     RefreshTable('#regionsdt', 'http://localhost:44379/api/RegionJSON'); 

     setTimeout(function() { AutoReload(); }, 30000); 
    } 

    $(document).ready(function() { 
     InitOverviewDataTable(); 
     setTimeout(function() { AutoReload(); }, 30000); 
    }); 


</script> 

Answer 1

我想你以錯誤的格式發送了一個json對象。基於https://datatables.net/examples/data_sources/ajax.html的正確格式是這樣的：

{ 
    "data": [ 
    [ 
     "south 2","1" 
    ], 
    [ 
     "Ahmedabad","2" 
    ], 
    [ 
     "Bangalore","3" 
    ], 
    [ 
     "Bhubaneswar","4" 
    ], 
    [ 
     "Bilshpur","5" 
    ] 
    ] 
}