如何返回所有列名/标题（并避免＆＃34; TypeError：table.columns（...）。名称不是函数＆＃34;）？

Question

我对this one提出了类似的问题。

我创建一个数据表，然后用户可以使用搜索功能，单击一个按钮，然后所选数据将被发送到另一个功能，在那里进一步处理。初始化表工作正常，也发送选定的数据works as intended。但是，我无法正确访问列名。

我使用的数据表版本：

 <script src="https://cdn.datatables.net/1.10.16/js/jquery.dataTables.min.js" type="text/javascript"></script>

一些背景知识： 通过单击链接（#calculate），可以创建一个表格，并且列标题看起来很好，例如像这样：

然后，用户可以选择条目（此处为88），然后使用第二个链接（#send_data）发回过滤后的数据。用于初始化列标题的数据如下所示（取自console.log(data.columns);）：

[…]
0: Object { name: "C1", title: "C1", sName: "C1", … }
1: Object { name: "C2", title: "C2", sName: "C2", … }
length: 2
__proto__: Array []

我也可以访问table.columns()，但是，当我尝试table.columns().names()或table.columns().title()我收到

时

  

TypeError：table.columns（...）。names不是函数。

如何访问和传递显示的列标题，即下面代码中col_names的内容？

相关代码如下：

<script type="text/javascript">
  $(document).ready(function() {
    var table = null;
    $('#calculate').bind('click', function() {
      $.getJSON('/_get_table', {
        a: $('#a').val(),
        b: $('#b').val()
      }, function(data) {
      console.log(data.columns);
        $("#elements").text(data.number_elements);
        if (table !== null) {
          table.destroy();
          table = null;
          $("#a_nice_table").empty();
        }
        table = $("#a_nice_table").DataTable({
          data: data.my_table,
          columns: data.columns
        });
      });
      return false;
    });
    $('#send_data').bind('click', function() {
        //console.log(table.columns());
        //console.log(table.columns().title());
        //console.log(table.columns().names());
      $.getJSON('/_selected_data', {

        sel_data: JSON.stringify(table.rows( { filter : 'applied'} ).data().toArray()),
        col_names: //what goes here?

      }, function(data) {
        alert('This worked')
      });
      return false;
    });
  });
</script>

Answer 1

从HTML表中提取表头看起来有点像hackish;根据你的代码，我认为你可以做这样的事情;在初始化表变量的部分，只需添加一行以保留您获得的JSON数据中的列列表：

table = $("#a_nice_table").DataTable({
            data: data.my_table,
            columns: data.columns
        });

table.columns = data.columns;  // dynamically add a property, store columns

然后你应该能够做到：

col_names: JSON.stringify(table.columns)

或者其中的一些变体，具体取决于data.columns中包含的数据结构的确切类型（如果它是一个简单的数组，它应该可以正常工作）。

Answer 2

这是一个可能的解决方案：

table.columns().header().toArray().map(x => x.innerText)

我使用了来自DataTable的API文档。用innerText替换innerHTML也有效。

Answer 3

我必须使用 DataTables O_SPI_CLK 方法获取所有列名称的数组。

我最终做了以下事情：

.settings()