Question

我正在使用jQuery DataTables，我的数据仅在我点击列长度下拉列表或在过滤器输入中键入文本时显示。

使用Javascript：

var oArtikliData = $.getJson('json.php?json=artikli');
oArtikliTable = $('#tbl_artikli').DataTable(
{   
    "aaData": oArtikliData,
    "columnDefs": 
    [
        { 
            /* REDNI BROJ */
            "targets": 0,   
            "data": "r_br" 
        },
        { 
            /* PROIZVOĐAČ */
            "targets": 1,   
            "data": "proizvodjac" 
        },
        { 
            /* MODEL */
            "targets": 2,       
            "data": "naziv"
        },
        { 
            /* CIJENA BEZ PDV */
            "targets": 3,       
            "data": "cijena_bezPDV"
        }
    ],
    "dom": 'R<"pdf_button"><"clear">lfrtip',
    "autoWidth": true,
    'iDisplayLength': 50,
    "lengthMenu": [[1,5,10, 25, 50], [1,5,10, 25, 50]]

    }
});

HTML：

<table style="margin-top:15px;" id="tbl_artikli" class="table table-striped table-bordered display">
                            <thead>
                                <tr class="nohover custom_table_header">
                                    <th>R.br.</th>
                                    <th>Proizvođač</th>
                                    <th>Model</th>
                                    <th>Cijena bez PDV-a</th>
                                </tr>
                            </thead>
                            <tbody>
                            </tbody>
                        </table>

我正在使用最新的jQuery，我在Chrome和Firefox中尝试过，但问题仍然存在。

为什么我的数据仅在某些情况下出现？

Answer 1

<强>解

在从远程源检索数据之前初始化您的表，这就是最初没有数据显示的原因。还有一些额外的右括号}应该删除。

请改用以下代码：

var oArtikliTable = $('#tbl_artikli').DataTable({   
    "ajax": {
       "url": 'json.php?json=artikli',
       "dataSrc": ""
    },
    "columnDefs": [
        { 
            /* REDNI BROJ */
            "targets": 0,   
            "data": "r_br" 
        },
        { 
            /* PROIZVOĐAČ */
            "targets": 1,   
            "data": "proizvodjac" 
        },
        { 
            /* MODEL */
            "targets": 2,       
            "data": "naziv"
        },
        { 
            /* CIJENA BEZ PDV */
            "targets": 3,       
            "data": "cijena_bezPDV"
        }
    ],
    "dom": 'R<"pdf_button"><"clear">lfrtip',
    "autoWidth": true,
    'pageLength': 50,
    "lengthMenu": [[1,5,10, 25, 50], [1,5,10, 25, 50]]

});

<强>样本

请参阅this jsFiddle以获取代码和演示。

数据表仅在单击列长度下拉列表或在筛选器上键入后显示数据

1 个答案: