剑道网格取消编辑在自定义命令按钮上丢失图标

Question

除了标准的编辑/删除按钮之外，我还在剑道网格中定义了一个自定义命令按钮：

{ name: "submit", text: " ", visible: "isSubmitable", click: submitItem }

按钮在数据绑定上被分配了一个图标：

$(".k-grid-submit").prepend("<span class='k-icon k-i-redo' style='color: blue'></span>");

但如果我单击编辑按钮然后取消，自定义按钮会丢失其图标。一种解决方法suggested by a Telerik Admin 是在取消事件上刷新数据源。这可行但很荒谬，特别是对于大型数据集，需要向服务器发出请求以获取数据源中已经存在的相同数据。

我尝试的一件事是将类附加到取消事件处理程序中的按钮，但此时按钮不存在：

onCancel: function (e) {
    // NB: following does not work - submit button doesn't exist until after this function is called
    const currentRow = $(e.container).closest("tr");
    currentRow.find(".k-grid-submit").prepend("<span class='k-icon k-i-redo' style='color: blue'></span>");

另一个建议是set the command text using jQuery:

col.Command(c => c.Custom("History").Click("showHistory")).Text($"<span class='k-icon k-i-reorder'></span> History");

除了定义网格的 mvvm 方法似乎没有提供绑定按钮 text 属性的选项之外，这会很棒。目前我正在使用从服务器刷新数据源的解决方法，但如果能够在没有服务器往返的情况下解决这个问题会很有帮助。

Answer 1

因为取消按钮是一个运行时元素，所以试试这个并删除事件取消。

$(document).on('click', 'cancelButtonSelector', function(){
// apply the icon to $(this)
});