Question

我有一个java函数，它从Java中的Servlet获取JSON数据字符串。我正在尝试使用该数据填充数据表（http://www.datatables.net/examples/data_sources/ajax.html）

这是DataTables网站指示用户填充数据表的方式：

$(document).ready(function() {
    $('#example').dataTable( {
        "ajax": '../ajax/data/arrays.txt'
    } );
} );

这是在我的servlet中调用doPost方法生成并返回JSON的javascript方法：

<script>
  $(document).ready(function() { // When the HTML DOM is ready loading, then execute the following function...
    //$('#somebutton').click(function() { // Locate HTML DOM element with ID "somebutton" and assign the following function to its "click" event...
    var bodyContent = $.ajax({
      url : "DAOserv",
      global : false,
      type : "POST",
      data : "name=value",
      dataType : "json",
      async : false,
      success : function() {
                  console.log("ok");
                  alert("ok");  
                }
    }).responseText;
    console.log(bodyContent);
  });
</script>

如何在var bodyContent中获取JSON字符串以填充数据表？

Answer 1

请参阅jQuery.ajax docs。在success回调的第一个参数中从服务器返回的数据。另请注意，使用此数据的所有操作都应位于此回调中。我想你还应该检查status参数：

$(document).ready(function() {
    var bodyContent = null;
    $.ajax({
        url : "DAOserv",
        global : false,
        type : "POST",
        data : "name=value",
        dataType : "json",
        success : function(data, status) {
            console.log(data);
            $('#example').dataTable( {
                "data": $.parseJSON(data),
                "columns": [
                    { "title": "Engine" },
                    { "title": "Browser" },
                    { "title": "Platform" },
                ]
            });   
         });
    });
});

更新要填充数据服务器，应该使用JSON编码的数据数据进行响应，您应该解析它并按照here传递给dataTable。

Answer 2

首先，你不是在做AJAX;当你这样做时：

var bodyContent = $.ajax({
    url : "DAOserv",
    global : false,
    type : "POST",
    data : "name=value",
    dataType : "json",
    async : false,
    success : function() {
            console.log("ok");
            alert("ok");    
}).responseText;

您设置async: false ...但AJAX代表 Asynchonous Javascript和XML。使用AJAX方法会发生以下情况：

您可以通过执行$.ajax
服务器需要很长时间才能响应;用户的浏览器在此期间未被锁定
当服务器响应success回调时，您定义的名称为

用你的方法

您可以通过执行$.ajax
用户的浏览器在等待回复时被锁定
当服务器响应您的代码时（在调用$.ajax之后）。

为了让您的代码真正实现AJAX，请执行以下操作：

var bodyContent = $.ajax({
    url : "DAOserv",
    global : false,
    type : "POST",
    data : "name=value",
    dataType : "json",
    success : function(responseText) {
            bodyContent = responseText
    }
});

当然，一旦响应回来，你还需要建立你的数据表，所以你真正想要的是：

    success : function(responseText) {
                $('#example').dataTable( {
                    "data": responseText
                });
    }

（或者那种效果;我忘记了DataTable的确切语法。）

获取JavaScript JSON字符串以填充DataTable

2 个答案: