javascript - 制表符添加每行带有按钮的列

Question

我正在使用名为 Tabulator 的 javaScript 库尝试添加列并允许用户能够在每行中上传 1 个图像文件。

(我只使用 JavaScript 而不是 Jquery)我看到了这个链接 https://github.com/olifolkerd/tabulator/issues/153 这有很大帮助，但并没有涵盖全部。

我已经在每行添加一个带有按钮的新列，但我需要能够为每行添加某种 ID，以便我可以选择它并将其连接到表单 会将图像发布到我的后端服务器。

我找不到任何有关如何使用此库执行此操作的文档，但我找到了一些答案，让我达到了这一点。

var openButton = function(value, data, cell, row, options){ //plain text value
var button ='<button>upload ID </button>';

    button.addEventListener('click',function(){
    console.log("button is working");
});

return button;
};

我的控制台上不断出现错误 button.addEventListener 不是函数

Answer 1

我终于明白了

首先必须添加包含函数的变量

var the_Function = function(cell, formatterParams, onRendered){ //plain text value

  //var formA = '<form class="" action="/upload" method="post">'
  //var inputFn = '<input type="file" id="imgupload" />' ;
  //var uploadBtnn = '<button type="submit" id="OpenImgUpload">ID upload</button></form>'
//return uploadBtnn
return "<i class='fa fa-print'>function_trigger</i>";
};

然后我们必须将格式化程序添加到列的

table.addColumn({title:"ID", field: "ID" ,formatter:the_Function,width:100, align:"center",cellClick:function(e, cell){ 

//button's function for example 
var Btn = document.createElement('Button');
Btn.id = "Btn_Id";
console.log(Btn);


}