json - 数据表:标题中带点 (.) 的列显示不正确

Question

DataTables 似乎将点 ( . ) 视为特殊字符，并且不显示列，这些列在标题中包含它们。

是否有任何解决方案如何保留点并使用某种转义字符？

错误是:请求未知参数“文档”。对于第 0 行，第 0 列

我的 JSON 数据表初始值设定项:

{
    "columns": [
        {
            "data": "Doc.",
            "title": "Doc."
        },
        {
            "data": "Order no.",
            "title": "Order no."
        }
    ],
    "data": [
        {
            "Doc.": "564251422",
            "Order no.": "56421"
        },
        {
            "Doc.": "546546545",
            "Order no.": "98745"
        }
    ]
}

Answer 1

当数据属性名称中有点时，dataTables 将查找嵌套的数据属性。就像如果有一样 Doc.<something>属性(property)。当您拥有自动化脚本时 - 正如您拥有的那样 - 服务器分发的 JSON 不一定是为 dataTables 设计的，您可以在将数据传递给 dataTables 之前“清理”数据。

我从昨天的答案中获取并添加了两个功能:sanitizeData和 sanitizeColumns . sanitizeData从键中删除所有点和空格，sanitizeColumns从 columns.data 中删除空格和点定义:

$.getJSON('https://api.myjson.com/bins/4z5xd', function(json) {
    //remove whitespace and dots from keys / attribute names    
    function sanitizeData(jsonArray) {
        var newKey;
        jsonArray.forEach(function(item) {
            for (key in item) {
                newKey = key.replace(/\s/g, '').replace(/\./g, '');
                if (key != newKey) {
                    item[newKey]=item[key];
                    delete item[key];
                }     
            }    
        })    
        return jsonArray;
    }            
    //remove whitespace and dots from data : <propName> references
    function sanitizeColumns(jsonArray) {
        var dataProp;
        jsonArray.forEach(function(item) {
            dataProp = item['data'].replace(/\s/g, '').replace(/\./g, '');
            item['data'] = dataProp;
        })
        return jsonArray;
    }    
    json.data = sanitizeData(json.data);
    json.columns = sanitizeColumns(json.columns);    

    $('#example').DataTable({
       data : json.data,
       columns : json.columns
    })
});  

演示 -> http://jsfiddle.net/egpxdsq7/