jQuery的數據表JSON解析錯誤

我只是想用下面的JSON對象查詢的數據表的一個例子...jQuery的數據表JSON解析錯誤

[{"firstName":"pom", 
"lastName":"sdfpom", 
"email":null, 
"password":"cfe9a43acec0a35f903bc2d646ce8e58b5ef6b67", 
"username":"Dave", 
"access":null, 
"id":1}, 
{"firstName":"FirstName", 
"lastName":"LastName", 
"email":null, 
"password":"8d60258ef3ae1b8eae67e9298f15edf5c6e05dfe", 
"username":"Username", 
"access":null, 
"id":2}]

這在下面的可變數據返回...

<script> 
$(document).ready(function() { 
    $.getJSON('userManagement/getAllUsers', function(data) { 
      $('#table').dataTable({ 
       "sAjaxSource": data 
     }); 
    }); 
}); 

    </script> 
    <table id="table"> 
     <thead> 
      <tr> 
       <th>firstName</th> 
       <th>lastName</th> 
       <th>email</th> 
       <th>password</th> 
      </tr> 
     </thead> 
     <tbody> 
      <tr> 
       <td>Row 1 Data 1</td> 
       <td>Row 1 Data 2</td> 
       <td>etc</td> 
      </tr> 
      <tr> 
       <td>Row 2 Data 1</td> 
       <td>Row 2 Data 2</td> 
       <td>etc</td> 
      </tr> 
     </tbody> 
    </table>

現在JSON似乎是有效的，當我做了其他任何事情，例如在jQuery中使用它，它工作正常，但數據表只是不能正確呈現。有沒有問題，我正在使用的JavaScript？

來源

2012-10-11 david99world

默認情況下，數據表將處理數組的數組對於它的數據源：當它需要處理對象數組時（如你的情況），還有一個額外的步驟。在插件文檔中描述了this example。基本上，你所要做的是添加的「列」屬性（如數組）說明：

$('#table').dataTable({ 
    "aaData": data, 
    "aoColumns": [ 
    { "mData": "firstName" }, 
    { "mData": "lastName" }, 
    { "mData": "email" }, 
    { "mData": "password" }, 
    { "mData": "username" }, 
    { "mData": "access" }, 
    { "mData": "id" } 
    ] 
});

這裏的fiddle一起玩。

來源

2012-10-11 17:12:53 raina77ow

這現在顯示錶，但它是空的，除了我已經在html中添加的行，當我刪除這些JSON數據不會填充表。你還有其他建議嗎？感謝您的反饋:) – david99world

更新了答案：當您使用JS結構時，您需要使用''aaData''鍵; 'sAjaxSource'用於提供返回源JSON的URL。 – raina77ow

感謝您的小提琴我設法解決'data = JSON.Parse（result.d）;返回數據;'這是爲新的dataTables，它不再使用'aoColumns'，但仍然在幾個小時後搞定了！ – ppumkin

你JSON是內部數組中的對象..

所以不是這個

"sAjaxSource": data

試試這個

"sAjaxSource": data[0]

來源

2012-10-11 17:07:31

這只是在html中顯示數據 - 當我完全刪除tBody數據時，它只顯示標題。我的JSON數據都不顯示。感謝您的反饋，雖然:) – david99world

首先檢查您的json是否有效或不使用www.jsonlint.com。

其次嘗試用aaData喜歡附上JSON對象：

{"aaData" :[{"firstName":"pom","lastName":"sdfpom","email":null, 
"password":"cfe9a43acec0a35f903bc2d646ce8e58b5ef6b67", 
"username":"Dave","access":null,"id":1}, 
{"firstName":"FirstName","lastName":"LastName","email":null, 
"password":"8d60258ef3ae1b8eae67e9298f15edf5c6e05dfe", 
"username":"Username","access":null,"id":2}] 
}

來源

2012-10-12 10:44:24 Arjun

是的JSON是有效的，我不能添加到JSON，因爲它是從Jackson與SpringMVC生成的，因此從對象到JSON表示的轉換是無縫的。 – david99world

如果生成的json與上面給出的json相同，則會產生錯誤。 – Arjun

這只是stackoverflow代碼標記的線條渲染，我會將其格式化，但它確實會生成有效的JSON – david99world

$.ajax({ 
      "dataType": 'json', 
      "type": "POST", 
      "url": sSource, 
      "data": aoData, 
      contentType: "application/json; charset=utf-8", 
      async : false, 
      success: function (json) { 
      fnCallback(json); 
      }, 
      complete: function (msg,a,b) { 
      console.log('complete :'+msg) 
      }, 
      error : function(msg,a,b) { 
      console.log('error:'+msg); 
      } 
     });

異步：假是非常重要的。這將導致不顯示頁面，直到json數據被正確綁定。

這對我有效。

來源

2015-04-07 07:01:00 Waqar

jQuery的數據表JSON解析錯誤

回答

相關問題