Question

我想使用AJAX调用将值显示在表中。用于它的代码是，

initTable();

function initTable (){
    return $('#exEmpListTable').dataTable({
        "bPaginate": false,
        "sScrollY": "200px",
        "bScrollCollapse": true
    });
}

function tableActions (){
    var oTable = initTable();
    // perform API operations with oTable
    oTable.fnSort( [ [1,'desc']] );
}

$("#btnShowExEmpList").click(function (e){
    var selectedShop = $('#Shop').val();
    if(selectedShop == null){
        alert(" Please select a shop first ");
        return false;
    }
    if(selectedShop != null){
        alert("==== Selected Shop ==== "+selectedShop);
        var $exEmpDialog = $("#Dialog").dialog({
            width :275,
            height: 400,
            resizable: false,
            position: ['top', 200],
            modal: true
        });
        $exEmpDialog.dialog('close');
        $.ajax({
            url : 'empReqCreateNewReq.do',
            data : { getExEmpList: true, SelectedShop : selectedShop, ajaxCall : true },
            method : 'GET',
            dataType : 'json',
            contentType: "application/json; charset=utf-8",
            success : function(data) {
                alert('success === ' +data.exemplist.length);
                alert("======== ELEMENTS ======== "+JSON.stringify(data));
                //rePopulateExEmpList(data);
                //data = JSON.stringify(data);
                $exEmpDialog.dialog('close');
                //$(this).dialog('close')
                var oTable = initTable();
                oTable = $("#exEmpListTable").dataTable();
                //oTable.fnClearTable(0);
                oTable.oData[data];
                oTable.fnDraw();
                $exEmpDialog.dialog('open');
            },
            error : function(xhr, status) {
                alert('Sorry, there was a problem while placing your ajax request. Contact Admin!');
            }
        });
    }
    //$("#Dialog").dialog();
});

在运行此操作时，我可以在警报机器人中看到valus。但在此之后，它会显示一条错误消息

DataTables warning (table id = 'exEmpListTable'): Cannot reinitialise DataTable.

要检索此表的DataTables对象，请将无参数传递给dataTable（）函数，或将bRetrieve设置为true。或者，为了破坏旧表并创建一个新表，将bDestroy设置为true（请注意，可以通过API对配置进行大量更改，这通常要快得多）。

请帮我解决这个问题。

Answer 1

我遇到了同样的问题......每次我需要重新加载它时，我都会通过销毁表来解决问题。我修改了我的代码以便与你合作，所以会像：

$(document).ready(function(){
  var oTable;

  //reloading table when the button is clicked
  $('#btnShowExEmpList').click(function(){

    //if the table already exists, destroy it
    if (oTable){
      oTable.fnDestroy();
    }

    //initializing the table
    oTable = initTable();
  });

  //initializing the table automatically when the page loads
  $('#btnShowExEmpList').click();
});

我还认为，如果为数据表设置一些选项（bServerSide，sAjaxSource，fnServerData等），使用成功选项重新加载数据会更容易。

使用Ajax调用填充数据表

1 个答案: