DataTables 显示空白单元格但行有数据

DataTables displaying blank cells but the rows have data

jQuery 的 DataTables 插件出现问题。 我正在使用 JSON 加载数据,但只有一些列显示了它们的值(请参见下面的屏幕截图)。

No values being displayed for the three right columns

但是,我使用 console.log(table.row(this).data()) 打印了 Datatables 中的选定行,打印结果显示列中有数据,但似乎没有数据。此外,我正在设置 "defaultContent": "",但是如果我将它设置为 "defaultContent": "Not set",DataTables 会为所有这些空白值显示“未设置”,这是预期的,但这意味着它以某种方式没有读取行中的内容。请检查控制台打印的下一张屏幕截图,其中包含列“Un.”、“Quant.”、“Total [€]”上的数据。

Console print on the client showing that the row holds data for the columns that appear blank on the table

值得注意的是,我在服务器或客户端上都没有收到任何错误。

有没有人经历过这个?

编辑:包含带有初始化设置的代码片段。

  modelParam = configurations.especialidades[modelName].modelParam
  tableParam = configurations.datatable.specs.tableParam
  colEspecialidade = configurations.datatable.specs.colName
  especialidade = configurations.especialidades[modelName].especialidade

  // Formatting columns array for DataTables
  let cols = (() => {
    let colArr = []
    jsonSheet[0].forEach(col => {
      colArr.push({ "data": col, "title": col, "defaultContent": "" })
    })
    return colArr
  })()

  // Creating new DataTable
  table = $('#selectionTable').DataTable({
    scrollY: '70vh',
    sScrollX: '100%',
    scrollCollapse: true,
    paging: false,
    lengthChange: false,
    autoWidth: false,
    select: true,
    cache: false,
    data: jsonSheet[1],
    columns: cols,
  })

  // Removing rows not compliant with the current model's specialization
  let indexes = table
    .rows()
    .indexes()
    .filter((value, index) => {
      return especialidade !== table.row(value).data()[colEspecialidade];
    })

  table.rows(indexes).invalidate().remove().draw()

jsonSheets[0] 包含以下数据:

[
    "Especialidade",
    "Artº",
    "Designação dos Trabalhos",
    "Item (BIM)",
    "Un.",
    "Quant.",
    "Total [€]",
    "Caract."
]

您的字段名称中存在的某些字符(方括号)存在问题 (Un. Quant. Total[€]) 但是在 column.data 选项中使用时对 DataTables 具有 特殊意义

  • dot 被 DT 解释为不是文字点,而是 嵌套对象语法
  • 方括号被解释为数组符号

在这两种情况下,DT 都会搜索未找到的数据,因此该列为空。

您可以看到这个 codepen 它可以完美地从字段名称中删除这些特殊字符。

你也可以看看 DataTables doc page 提到这个问题(在 string 框内)。

解决点的方法是用双斜杠将其转义,遗憾的是方括号无法转义。

也许在这种情况下,为列设置数据的 function(row, type, set, meta ) 语法可能是更好的选择。

另见