YUI 2.8.2 数据表在客户端按钮单击操作完成后对旧值进行排序答案

【问题标题】：YUI 2.8.2 datatable sorts old value after a client side button click action is doneYUI 2.8.2 数据表在客户端按钮单击操作完成后对旧值进行排序
【发布时间】：2014-12-18 12:04:33
【问题描述】：

我正在使用 YUI 数据表 2.8.2。我需要单击删除按钮和一个ajax请求，成功响应后，单击的删除按钮应替换为 “已删除” 文本。但是，当我对任何列进行排序时，“已删除”文本会消失，因为旧数据已被排序。默认情况下，所有按钮文本应为“删除？”。有什么帮助吗？？

参考：

// Create a new YUI instance and populate it with the required modules.

YUI().use('node', function (Y) { Y.one('body').addClass('yui-skin-sam'); });

http://jsfiddle.net/ejx3zex3/1/

【问题讨论】：

标签： javascript yui yahoo yahoo-api yui-datatable

【解决方案1】：

原因是当您对表格进行排序时，它会重新呈现自己。当有人点击按钮时，它不会改变任何状态（即关于底层数据的任何东西），你只是改变了单元格的 innerHTML。当重新渲染发生时，现有内容将被基础数据覆盖。

因此，要做您想做的事，您需要为“是否已删除”数据创建一个字段，并在有人单击按钮时更新它的值。然后，该列的渲染函数将查看“是否已删除”值并根据该值显示“删除”或“已删除”。

类似这样的：http://jsfiddle.net/ejx3zex3/2/

主要是添加一个已删除的键/字段：

var myColumnDefs = [{
        key: "deleted",
        formatter: function (el, oRecord, oColumn, oData) {
            el.innerHTML = "<button type=\"button\" class=\"yui-dt-button\">Delete" + (oData ? "d" : "") + "</button>";
        },
        "label": "Delete?"
    },

它仍然不理想，但希望足以让你上路。

顺便说一句，我假设您知道 YUI2 已经被弃用了几年，而 YUI3 今年已停产。

【讨论】：

它很好。但实际问题是，一旦单击按钮，整个按钮应该被删除，只需替换“已删除”文本（仅文本）。否则按钮可以被禁用会更好。
谢谢，优秀的解决方案。我明白了...这是更新的小提琴jsfiddle.net/ejx3zex3/3。干得好@Matt Parker。