2

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 を使用して行うことができます)。

この問題を解決するのを手伝ってください。

4

1 に答える 1

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など）を設定すると、代わりに成功オプションを使用してデータをリロードする方が簡単だと思います。

于 2014-05-04T12:06:53.470 に答える