如何在单元格中添加自定义按钮?

aps*_*842 6 button handsontable

我想在handsontable的每一行的末尾添加一个自定义保存按钮.我在laravel 4中使用handontable包.

按钮显示如下:

在此输入图像描述

<button>Save</button>
Run Code Online (Sandbox Code Playgroud)

war*_*ech 9

尝试使用 htmlRenderer

演示:http://docs.handsontable.com/0.19.0/demo-custom-renderers.html

var actionRenderer = function (instance, td, row, col, prop, value, cellProperties) {
  var $button = $('<button>');
  $button.html(value)
  $(td).empty().append($button); //empty is needed because you are rendering to an existing cell
};

var $container = $("#example1");
$container.handsontable({
  /*....*/
  columns: [
    /*....*/
    {data: "action", renderer: actionRenderer}
  ]
});
Run Code Online (Sandbox Code Playgroud)

为了获得更好的性能,渲染器可以用纯JavaScript编写


aps*_*842 4

我找到了我自己问题的答案..我在handsontable中使用了“渲染器”将单元格渲染为HTML

columns: [
                    {data: "unique_no"},
                    {data: "title"},
                    {data: "subject"},
                    {data: "year"},
                    {data: "duration"},
                    {data: "color"},
                    {data: "language"},
                    {data: "synopsis"},
                    {data: "director"},
                    {data: "basic_format"},
                    {data: "created_at"},
                    {data: "updated_at"},
                    {data: "action", renderer: "html",readOnly: true}

                  ],
Run Code Online (Sandbox Code Playgroud)

这是我找到它的地方http://handsontable.com/demo/renderers_html.html#dropdown