Ext js 添加到 Ext msg 一个 "don't ask anymore" 复选框

Question

如何向我的 Ext.Msg 添加一个带有文本 "don't ask anymore" 的复选框，这样用户就不必总是确认他想要执行特定操作（在我的情况下发送消息）？

这是我的代码：

Ext.Msg.show({
   title: 'Send Message',
   message: 'Are you sure you want to send the message?'
   buttons: Ext.Msg.YESNO,
   fn: function(btn) {
         if (btn === 'yes') {
                 ...
         } else if (btn === 'no') {
                ...
         }
   }
});

Answer 1

我在这里看到了几种方法，最简单的是使用 cookie 来记住浏览器中的用户决定。另一种解决方案是记住服务器端的决定，在这种情况下将不会依赖于浏览器。在下面的示例中，我使用了 cookie 并将 Ext.msg.show(...) 包装在另一个单例中 class.

Ext.define('CustomMsg', {
    singleton: true,
    cookiePrefiex: 'DontShowMessageBox',
    cookieToolbarId: 'CookieToolbar',

    show: function (messageBoxId, config) {
        var cookieName = this.getCookieName(messageBoxId),
            me = this;

        if(Ext.util.Cookies.get(cookieName) === 'true') {
            return;
        }
        var msgBox = Ext.Msg.show(config);
        this.addCookieToolbar(cookieName, msgBox);
        msgBox.on('hide', function(msgBox) {
            this.removeCookieToolbar(msgBox);
        }, this, {single: true});
    },

    addCookieToolbar: function(cookieName, msgBox) {
        msgBox.add({
            xtype: 'toolbar',
            itemId: this.cookieToolbarId,
            items: [{
                xtype: 'checkbox',
                fieldLabel: "don't ask anymore",
                listeners: {
                    change: function (checkbox, newValue) {
                        Ext.util.Cookies.set(cookieName, newValue);
                    }
                }
            }]
        });
        return this;
    },

    removeCookieToolbar: function(msgBox) {
        var cookieToolbar = msgBox.getComponent(this.cookieToolbarId);
        if(cookieToolbar) {
            msgBox.remove(cookieToolbar);
        }
        return this;
    },

    getCookieName(checkBoxId) {
        return this.cookiePrefiex + '-' + checkBoxId;
    }
});

Fiddle

您也可以在 Ext.panel.Panel 的基础上创建您自己的 MessageBox，在这种情况下您将不必实现工具栏注入机制。

Ext js 添加到 Ext msg 一个 "don't ask anymore" 复选框

Ext js add to the Ext msg a "don't ask anymore" checkbox

javascript

checkbox

extjs

message

confirmation