具有每周日期格式的 Handsontable 标题答案

【问题标题】：Handsontable header with weekly date format具有每周日期格式的 Handsontable 标题
【发布时间】：2017-03-30 16:42:27
【问题描述】：

我想实现handsontable like header 包含每周日期格式，更多请查看下面的图片

标题从当前日期开始到接下来的 7 天，一个按钮用于滚动下一个和上一个日期。我尝试使用 help 的以下代码

 {
    type: 'date',
    dateFormat: 'MM/DD/YYYY',
    correctFormat: true,
    defaultDate: '01/01/1900'
  }

但它将日期选择器显示为单元格值而不是列标题。有谁知道如何使用handsontable在列标题中显示从星期一开始的当前周。

【问题讨论】：

标签： date handsontable

【解决方案1】：

经过一些搜索并在 java 脚本的帮助下，我提供了我的解决方案以进行更多检查

function loadTable(weekDays) {
var example2 = document.getElementById('example2');
var hot2 = new Handsontable(example2, {
data: Handsontable.helper.createSpreadsheetData(3, 7),
colHeaders: weekDays
});

function bindDumpButton() {
  if (typeof Handsontable === "undefined") {
    return;
  }

  Handsontable.Dom.addEvent(document.body, 'click', function (e) {

    var element = e.target || e.srcElement;

    if (element.nodeName == "BUTTON" && element.name == 'dump') {
      var name = element.getAttribute('data-dump');
      var instance = element.getAttribute('data-instance');
      var hot = window[instance];
      console.log('data of ' + name, hot.getData());
    }
  });
}
bindDumpButton();
}

更多信息请查看JsFiddle

【讨论】：

【解决方案2】：

您不能使用此方法，因为列仅用于正文表。

你可以使用 afterGetColHeader (doc) :

afterGetColHeader(col, TH) {

}

并在 TH 元素中插入日期选择器。

【讨论】：