DataTables：header 中带点 (.) 的列显示不正确

Question

DataTables 似乎将点 (.) 视为特殊字符并且不显示列，它们在 header 中。

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

错误是：为第 0 行第 0 列请求了未知参数 'Doc.'

我的 JSON DataTable 初始值设定项：

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

Answer 1

试试这个：

"columns": [
    {
        "data": "Doc&#46;",
        "title": "Doc&#46;"
    },
    {
        "data": "Order no&#46;",
        "title": "Order no&#46;"
    }
],
"data": [
    {
        "Doc&#46;": "564251422",
        "Order no&#46;": "56421"
    },
    {
        "Doc&#46;": "546546545",
        "Order no&#46;": "98745"
    }
]

尽管这也有效：

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

Answer 2

当数据中有点时属性 names dataTables 将查找嵌套的数据属性。就像有 Doc.<something> 属性一样。当您拥有自动化脚本时 - 正如您拥有的那样 - 服务器正在分发 JSON 不一定是为 dataTables 设计的，您可以 "sanitize" 在将数据传递给 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/

Answer 3

我知道我迟到了，但我解决这个问题的方法是替换所有“。”和 ”\\。”在数据表选项的 "columns" 值中。

Datatables 仍会找到带句点的值，并且不会崩溃。我在这里找到了这个信息：https://datatables.net/reference/option/columns.data

我在向列对象中添加项目时所做的就是运行这个：

for(var i =0; i < columnNames.length;i++){
    //replaces all "." with "\." which datatables ignores
    columnNames[i] = columnNames[i].replace(/\./g,'\.');
}

//other code goes here

var datatableOptions = {
        'data': myData,
        columns: tableColumns,
    };

DataTables：header 中带点 (.) 的列显示不正确

DataTables: Columns with dot (.) in header not displaying correctly

datatable

json

datatables

jquery-datatables-editor

datatables-1.10