如何在组标题中添加可点击按钮？答案

【问题标题】：How to add a clickable button to the group header?如何在组标题中添加可点击按钮？
【发布时间】：2020-05-14 03:01:35
【问题描述】：

我们可以使用groupHeader: function(){ //code here }自定义组头标题。

知道如何在组标题中添加可点击按钮吗？现在按钮是可点击的，但是一旦按钮被点击，我们如何触发事件呢？

// Tabulator
...
groupHeader: groupHeaderFormatter,

// Function
function groupHeaderFormatter(value, count, data, group) {
   let code = `<span id="valueText">${value}</span><button class="btn btn-link" id="btn"><i class="far fa-star"></i>`
   return code;
}

谢谢:)

【问题讨论】：

在文档的此链接中搜索groupClick 回调。我认为它会做你需要的。 tabulator.info/docs/4.6/callbacks

标签： javascript html tabulator

【解决方案1】：

您可以像在 HTML 中一样注册 onclick 处理程序：

<button onclick="myFunction"></button>

当用户点击按钮时调用myFunction。

function groupHeaderButtonClicked() {
    alert("You clicked the button.")
}

// Function
function groupHeaderFormatter(value, count, data, group) {
    return `<span id="valueText">${value}</span><button onclick="groupHeaderButtonClicked" class="btn btn-link" id="btn"><i class="far fa-star"></i></button>`
}

别忘了关闭<button>。

【讨论】：