Question

我有一个用extJS 4构建的MVC应用程序。我想从控制器中禁用网格面板中的停靠按钮这是我的网格面板视图：

Ext.define('SDI.view.MissionsGridPanel', {
extend: 'Ext.grid.Panel',
alias: 'widget.missionsGridPanel',
width: 688,
title: 'Missions',
store: 'MissionsStore',
tbar:[
                {
                    text:'Delete mission',,
                    icon: '/images/delete.png',
                    itemId: 'removeMissionButton',
                    disabled: true,
                    action :'delete'
                }
            ]...

这是我的控制器：

Ext.define('SDI.controller.MissionsController', {
extend: 'Ext.app.Controller',
views: ['SDI.view.MissionsGridPanel'],
refs: [
    {
            selector:'missionsGridPanel',
            ref:'missionsGridPanel'
      },
    {
            selector:'missionsGridPanel button[action=delete]',
            ref:'missionsGridPanelToolbarDelButton'
      }
    ],
init: function() {

     this.control({
        'missionsGridPanel': {
            selectionchange: this.onMissionSelect
        }

})
},

onMissionSelect: function(pTarget,pRecord,pOptions){
    console.log("Mission is selected")
    this.getMissionsGridPanelToolbarDelButton().setDisabled(false);
}

});

我不明白为什么这不起作用。 “已选择任务”已被记录，但该按钮仍处于禁用状态。

Answer 1

以下是解决此问题的方法 -

转到Firebug控制台，输入：

Ext.ComponentQuery.query('missionsGridPanel button[action=delete]')

并查看是否有任何返回。我建议安装Illuminations for Developers firebug插件，以进一步帮助您弄清楚页面上的内容。

Answer 2

我不确定为什么它不起作用，但如果你用itemid调用它就可以了：

selector: 'missionsGridPanel #removeMissionButton'

在控制器的视图中禁用停靠按钮

2 个答案: