DataTables 从 Ajax 问题构建 table，从文件中确定，参数丢失？ table 中没有可用数据

Question

我在使用数据表从 javascript 填充数据时遇到问题。

如果我从文件加载相同的 javascript 结果，它可以完美地使用 Datatable 参数定义中的 "ajax" 属性。了解到我需要改用 "data" 属性。

文件包含：{ "data": [{ "meter": "test", "id": 15, "desc": "testDesc"}] }

这是我的功能：

$(document).ready(function () {
    dataset = {
        "data": [{
            "meter": "test",
            "id": 15,
            "desc": "testDesc"
        }]
    };
    //var dataset = [  ['test','15','testDesc'] ];            

    $('#MeterDataTable').DataTable({
        //"ajax": 'DataTables-1.10.7/examples/ajax/data/meterDataJsonDown.txt',
        "data": dataset,
            "columns": [{
            "data": "meter"
        }, {
            "data": "id"
        }, {
            "data": "desc"
        }]
    });
    //saveToFile(dataset);
    //  alert('dataset is '+ dataset);
});

HTML

<table id="MeterDataTable" class="display" cellspacing="0" width="100%">
    <thead>
        <tr>
            <th>meter</th>
            <th>id</th>
            <th>desc</th>
        </tr>
    </thead>
    <tfoot>
        <tr>
            <th>meter</th>
            <th>id</th>
            <th>desc</th>
        </tr>
    </tfoot>
</table>

这可行，但需要通过删除列名来格式化 jSon javascript 返回的数据。

$(document).ready(function () {
    var dataset = [
        ['test', '15', 'testDesc']
    ];
    $('#MeterDataTable').DataTable({
        "data": dataset,
            "columns": [{
            "title": "meter"
        }, {
            "title": "id"
        }, {
            "title": "desc"
        }]
    });
});

更新： http://jsfiddle.net/j5a390d9/

Answer 1

您的 DataTables 脚本已过时。旧脚本使用不同的语法从 JavaScript 加载数据表。

请参阅 this JSfiddle 查看您的示例是否有效 - 您可以使用以下版本的 DataTables 脚本：

https://cdn.datatables.net/1.10.0/js/jquery.dataTables.js

Answer 2

我终于有了一个符合我最初要求的工作函数。

由于我的 jSon 返回的对象包含列名信息， [{ "meter": "test", "id": 15, "desc": "testDesc"}], 我想按原样使用这种格式，而不是必须剥离内容，因为如果返回对象的顺序被改变，table 的工作原理是一样的。

还没有在 jsFiddle 中运行它。 http://jsfiddle.net/j5a390d9/5/ 但在我的应用程序中工作正常。使用 jsFiddle 的原因是我正在对未在 Internet 上公开的 Web 服务进行 ajax 调用。已尝试从我网站上上传的文件中获取响应，但由于跨站点脚本而无法获得响应。尝试了代理但仍然如此。

无论如何，这是我的工作代码。

var dataset ;

        function meterData() {
            $.ajax({
                type: "POST",
                url: "jSonServices.asmx/getAllMeters",
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                async: false,
                cache: false,
                timeout: 10000,
                success: function (msg) {
                    if ((msg).length < 5)
                        alert("No data Found!");
                    else {
                        //dataset =  [{ "meter": "test", "id": 15, "desc": "testDesc"}];
                        // !important! Parse msg.d string into object                  
                        var obj = JSON.parse(msg.d);                                       
                 $('#MeterDataTable').DataTable(
            {
                "aaData": obj,
                "aoColumns": [
                            { "mData": "meter" },
                            { "mData": "id" },
                            { "mData": "desc" }
                           ]
            }
            );
                    }
                },
                error: function (e) {
                    alert("not ok" + e.responseText);
                }
            });    

        }              

        $(document).ready(function () {
            meterData();            
        });

DataTables 从 Ajax 问题构建 table，从文件中确定，参数丢失？ table 中没有可用数据

DataTables build table from Ajax issue, ok from file, parameter missing? No data available in table

javascript

ajax

jquery

datatables