从控制器禁用视图中的停靠按钮答案

【问题标题】：Disable docked button in a view from controller从控制器禁用视图中的停靠按钮
【发布时间】：2012-01-17 14:40:49
【问题描述】：

我有一个使用 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);
}

});

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

【问题讨论】：

标签： model-view-controller view controller extjs4

【解决方案1】：

这是解决此问题的方法-

转到 Firebug 控制台，输入以下内容：

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

看看是否有任何东西被退回。我建议安装 Illuminations for Developers firebug 插件，以进一步帮助您了解页面上的内容。

【讨论】：

此命令返回 2 个对象的集合：[Object { initialConfig={...}, xtype="button", text="Deletemission", more...}, Object { initialConfig ={...}, xtype="button", text="删除任务", 更多...}]
好吧，对不起。我在 application.js 文件中添加了“autoCreateViewport:true”。所以每个对象都被创建了两次。感谢您的帮助

【解决方案2】：

我不知道为什么它不工作，但如果你通过 itemid 调用它，它工作正常：

selector: 'missionsGridPanel #removeMissionButton'

【讨论】：