DataTables - 未捕获的TypeError

时间:2017-09-15 05:58:09

标签: json dynamic datatables uncaught-typeerror

我对这个领域的了解几乎没有任何意义,所以我提前为做饭做饭而道歉。

我已经将DataTables用于其他方面,因为它提供了如此惊人的功能,我想尝试制作一些不太依赖或假设要显示的数据/列的东西。

以下是我所使用的示例,并且在我获取DataTables的地方并不起作用 - Uncaught TypeError

    <!DOCTYPE html>
    <html>
      <head>
    <script src="http://code.jquery.com/jquery-2.1.4.min.js"></script>
        <script src="http://code.jquery.com/jquery-1.11.3.min.js"></script>

        <link href="https://nightly.datatables.net/css/jquery.dataTables.css" rel="stylesheet" type="text/css" />
        <script src="https://nightly.datatables.net/js/jquery.dataTables.js"></script>

        <meta charset=utf-8 />
        <title>DataTables - JS Bin</title>
      </head>
      <body>
        <div class="container">
                        <table id='tblAms' class='display responsive col-md-12 table-hover table-striped order-column'> <!-- width="100%" cellspacing="0"> -->
                    </table>
        </div>
<script>

    $(document).ready( function () {

      var outCols ={};

      var resultSet = JSON.parse('{"REC":{"COL_CNT":2,"COLUMNS":[{"title":"NAME"},{"title":"COUNTRY"}],"CNT":5,"DATA":[{"QUAL":[{"COL_VAL":"Ronaldo"},{"COL_VAL":"Spain"}]},{"QUAL":[{"COL_VAL":"Messi"},{"COL_VAL":"Spain"}]},{"QUAL":[{"COL_VAL":"Sanchez"},{"COL_VAL":"England"}]},{"QUAL":[{"COL_VAL":"Alli"},{"COL_VAL":"England"}]},{"QUAL":[{"COL_VAL":"Dybala"},{"COL_VAL":"Italy"}]}]}}');


            $.each(resultSet, function(k, v){
                outCols.COLUMNS = v.COLUMNS;

        var tst = [];
        var tst2 = [];

                $.each(v.DATA, function(index, value){
                    tst = $.map(value.QUAL, function(val, ind){
                     return val.COL_VAL;
                    });
                    tst2.push(tst);
                });

                outCols.DATA = tst2;


            });


            var table = $('#tblAms').DataTable({

            colReorder: true,
            destroy: true,

            "bFilter":true,


            data: outCols[0].DATA,
            columns: outCols[0].COLUMNS

            });
    } );

</script>
      </body>
    </html>

我在SO上看到了一个例子,其中提出了这种方法,但我太绿了,无法让它发挥作用。同样,重要的是显示所需的列数可能会发生变化。我也不能对JSON做很多事情,所以必须遵循示例格式(标题/列的数量需要灵活)。

感谢您的帮助。

0 个答案:

没有答案