Question

我有3个按钮，当我点击按钮3时，我想要禁用按钮1和2。我能够做到这一点。当我尝试设置另一个监听器时，单击按钮2以禁用按钮1和3，它不能正常工作。好像它可能在某种循环中。以下是我的代码：

{
                                text: 'Button 1',
                                name: 'button1',
                                cls: 'x-btn-text-icon',
                                listeners: {"click": function (){
                                    Ext.getCmp("button2").disable();
                                    Ext.getCmp("button3").disable();
                                    }
                                },
                                icon: 'public/images/edit.gif'
                            },{
                                text: 'Button 2',
                                name: 'button2',
                                cls: 'x-btn-text-icon',
                                listeners: {"click": function (){
                                    Ext.getCmp("button1").disable();
                                    Ext.getCmp("button3").disable();
                                    }
                                },
                                icon: 'public/images/edit.gif'
                            },{
                                text: 'Button 3',
                                name: 'button3',
                                cls: 'x-btn-text-icon',
                                listeners: {"click": function (){
                                    Ext.getCmp("button1").disable();
                                    Ext.getCmp("button2").disable();
                                    }
                                },
                                icon: 'public/images/edit.gif'
                            }

有没有更简单的方法来实现这一目标？我感谢任何帮助。

Answer 1

Ext.getCmp用于id属性。您的按钮具有name属性，将name更改为id，您的示例应该有效。

Answer 2

我认为您可能正在寻找的是toggleGroup。

Answer 3

我使用了替代方式，但我不确定是否符合您的需求。如果它对您有意义，请尝试以下。

我已经在范围外创建了一个数组来保持按钮ID。
然后启用了一个功能来禁用除了点击之外的按钮。
我使用按钮组来组织按钮

var buttons = new Array();

var disableButtons = function (btn) {
    // here it is to query button group by name
    var btns = Ext.ComponentQuery.query('buttongroup, [name=btnGroup]');
    var count = btns.length;

    for (var i = 1, x = 0; i < count; i++, x++) {
        this.buttons[x] = btns[i].id;
    }

    // this is the tricky part, disable all buttons except the clicked
    var index = this.buttons.indexOf(btn);
    if (index !== -1) {
        this.buttons.splice(index, 1);
    }

    Ext.Array.each(buttons, function (name) {
        Ext.getCmp(name).disable();
    })
}

// in any case, I created a function to enable all button status
// just add an other button in the scene and call this function
var enableButtons = function () {
    Ext.Array.each(buttons, function (name) {
        Ext.getCmp(name).enable();
    });
    // The following line necessary to keep array clean when user wants to disable
    // buttons again. The best way to empty an array, just set length to '0'
    buttons.length = 0;
}


// I used these functions for window component. When user click 'ADD' button, 
// buttons listener calls this function
{
text: 'EKLE',
scale: 'medium',
disabled: true,
width: 100,
margin: '0 9 0 0',
cls: 'btn-article-save',
id: 'btnArticleSave',
name: '_btnArticle',
listeners: {
    click: function () {
        var sel = Ext.getCmp('article-grid').getSelectionModel().getSelection();
        Ext.each(sel, function (item, index) {
            arrArticle.push(item);
        });

        arrArticleStore.load();
        Ext.getCmp('articles-grid').getView().bindStore(arrArticleStore);
        Ext.getCmp('articles-grid').show();

        var alevel = Ext.ComponentQuery.query('textfield[name=artLevel]');
        var avalue = Ext.ComponentQuery.query('textfield[name=artValue]');

        var artActions = [];
        for (var i = 0; i < alevel.length; i++) {
            artActions[i] = {'LEVELS': alevel[i].value, 'VALUES': avalue[i].value}
        }
        var count = winArticle.down('fieldset[id=article-fieldset]').items.items.length;
        for (i = 1; i <= count; i++) {
            var container = 'artContainer' + i;
            winArticle.down('fieldset[id=article-fieldset]').remove(container);
        }

        var qry = winArticle.query();
        for (var i = 0; i < qry.length; i++) {
            if (qry[i].xtype === 'textfield') {
                var txt = qry[i].id;
                Ext.getCmp(txt).reset();
                articles.loadData([], false);
            }
        }

        var _name = this.name;
        disableButtons(_name);
    }
}

}

单击特定按钮时禁用某些按钮

3 个答案: