使用來自servlet的Ajax數據加載JQuery數據表

Question

我在這裏找過類似的帖子，但找不到符合我的要求的帖子。我正在嘗試顯示jquery數據表。在UI上，我獲取日期參數並對servlet進行ajax調用。該servlet將處理並返回json數據。一旦我得到數據，我想在數據表中顯示結果。但我的代碼不起作用。我是Datatables的新手。這裏是我的代碼：

function fetchLogs(){ 
$.ajax({ 
    type: "POST", 
    url: "LogsServlet", 
    data: 'FromDate='+from+'&'+'ToDate='+to, 
    dataType: 'json', 
    success: function(data){ 
     /*$('#logs').dataTable({ 
      "aaData": data, 
      "aoColumns": [{ "mDataProp": "Executed_AT" }, { "mDataProp": "User_Name"}] 
     });*/ 
     $('#logs').dataTable({ 
      "bProcessing": true, 
      "sAjaxSource": data 
     }); 

    } 

}); 

} 

JSON數據是Servlet返回：

[{"user_id":"rams.orvz@xyz.com","executed_at":"Jul 8, 2013 7:22:59 PM"}] 

Answer 1

得到了解決。下面是解決它的代碼：

function fetchLogs(){ 
$.ajax({ 
    type: "POST", 
    url: "LogsServlet", 
    data: 'FromDate='+from+'&'+'ToDate='+to, 
    dataType: 'json', 
    success: AjaxFetchDataSucceeded, 
    error: AjaxFetchDataFailed 

}); 

} 

function AjaxFetchDataSucceeded(result) { 
    if (result != "[]") { 
     //var dataTab = $.parseJSON(result); 
     $('#logs').dataTable({ 
      "bProcessing": true, 
      "aaData": result, 
      //important -- headers of the json 
      "aoColumns": [{ "mDataProp": "user_id" }, { "mDataProp": "executed_at" }], 
      "sPaginationType": "full_numbers", 
      "aaSorting": [[0, "asc"]], 
      "bJQueryUI": true 

     }); 
    } 
} 

function AjaxFetchDataFailed(result) { 
    alert(result.status + ' ' + result.statusText); 
} 

但是，顯示的數據表在外觀方面完全是尷尬的。