使用来自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); 
} 

但是，显示的数据表在外观方面完全是尴尬的。