0

Ajax のデータを取得する 2 つ以上の DataTables を配置したいページがあります。発生する問題は、最初の DataTable が埋められているが、2 番目のエラー メッセージを埋めようとすると、次のようになることです。

DataTables 警告: テーブルではないノードで DataTables を初期化しようとしました: DIV

<script type="text/javascript">
    var oTableSetor;
    var oTableEstoque;

    function dtConvFromJSON(data)
    {
        return data;
    }

    $(document).ready(function () {
        $('.dataTable').dataTable();
        GridProdutoLote();    
        GridProdutoEstoque();
    });

    function GridProdutoLote() {
        if (oTableSetor===undefined)
        {
            oTableGrid = $('#lista_lote').dataTable({           
                "bServerSide": true,           
                "sAjaxSource": '@Html.Raw(@Url.Action("ListaGenerica", "Home", new { aController = "ProdutoLote", filtroID = @Model.ProdutoID  } ))',
                "bProcessing": true,
                "sPaginationType": "full_numbers",                  
                "aoColumns": [
                            { "mDataProp": "ProdutoLoteID", "sTitle": "ID"},
                            { "mDataProp": "Lote", "sTitle": "Lote" },
                            { "mDataProp": "Identificacao", "sTitle": "Identificação"},
                            { "mDataProp": "DtFabricacao", "sTitle": "Dt. Fabricação", "mRender": function (data, type, full) { return dtConvFromJSON(data); } },
                            { "mDataProp": "DtValidade", "sTitle": "Dt. Validade", "mRender": function (data, type, full) { return dtConvFromJSON(data); }},
                            { "mDataProp": "QtdeAtual", "sTitle": "Qtde. Atual"},
                            { "mDataProp": "QtdeEmUtilizacao", "sTitle": "Qtde. em Utilizacao"},                           
                            { "mData": null, "bSortable": false, "fnRender": function (o) {return '<a class="icone_16x16_detalhe" href=/Setor/Detalhar/' + o.aData["ProdutoLoteID"] + '>D</a>';}}                         
                ],
            });
        }
    };


    function GridProdutoEstoque() {
        if (oTableEstoque===undefined)
        {
            oTableEstoque = $('#grid_estoque').dataTable({           
                "bServerSide": true,           
                "sAjaxSource": '@Html.Raw(@Url.Action("ListaGenerica", "Home", new { aController = "ProdutoEstoque", filtroID = @Model.ProdutoID  } ))',
                "bProcessing": true,
                "sPaginationType": "full_numbers",                  
                "aoColumns": [
                            { "mDataProp": "ProdutoEstoqueID", "sTitle": "ID"},                        
                            { "mDataProp": "Identificacao", "sTitle": "Identificação"},
                            { "mDataProp": "Lote", "sTitle": "Lote", "mRender": function (data, type, full) { return dtConvFromJSON(data); } },
                            { "mDataProp": "QtdeMinima", "sTitle": "QtdeMinima", "mRender": function (data, type, full) { return dtConvFromJSON(data); }},
                            { "mDataProp": "QtdeAtual", "sTitle": "Qtde. Atual"},
                            { "mDataProp": "QtdeEmUtilizacao", "sTitle": "Qtde. em Utilizacao"},                           
                            { "mData": null, "bSortable": false, "fnRender": function (o) {return '<a class="icone_16x16_detalhe" href=/Setor/Detalhar/' + o.aData["ProdutoEstoqueID"] + '>D</a>';}}                         
                ],
            });
        }
    };

</script>


<div class="linha left" id="grid_lote">   
    <br />       
    <br />
    <table id="lista_lote" class="display">
        <thead>
            <tr>
                <th></th>
                <th></th>
                <th></th>
                <th></th>               
                <th></th>
                <th></th>
                <th></th>
                <th></th>
            </tr>
        </thead>
        <tbody>
        </tbody>
    </table>
</div>

<div class="linha left" id="grid_estoque">   
    <br />       
    <br />
    <table id="lista_estoque" class="display">
        <thead>
            <tr>
                <th></th>
                <th></th>
                <th></th>
                <th></th>               
                <th></th>
                <th></th>
                <th></th>               
            </tr>
        </thead>
        <tbody>
        </tbody>
    </table>
</div>
4

1 に答える 1

2

idのTABLEではなく、idのDIVにデータテーブルを作成しています。また、datatable は html TABLEでのみ作成できます。grid_estoquelista_estoque

したがって、

oTableEstoque = $('#grid_estoque').dataTable({

に

oTableEstoque = $('#lista_estoque').dataTable({
于 2013-08-01T12:25:21.637 に答える