ExtJS 3 DataGrid：如何使标题菜单中的最后一个检查项处于非活动状态

Posted 2023-02-26

【中文标题】ExtJS 3 DataGrid：如何使标题菜单中的最后一个检查项处于非活动状态

【英文标题】：ExtJS 3 DataGrid: How to make inactive the last checked item in header menu

【发布时间】：2012-07-11 10:33:02

【问题描述】：

主题。

就我而言，我可以删除所有复选框 - 这是错误的。它应该像 Sencha GXT CheckBox Grid：http://i.stack.imgur.com/rhRCr.png

说明： 1) 渲染数据网格 2）点击排序菜单，选择“列” 3）以任何顺序隐藏一些列（例如，4 of 5） 4) 最后一个菜单项应该像屏幕截图一样变为非活动状态。

最后一个 - 我的意思是它不是 id = (colCount - 1) 的项目。

【问题讨论】：

别忘了接受答案

【参考方案1】：

GridView 负责处理Header 菜单，这包括Columns 菜单。但是 GridView 没有您要求的行为。

要完成此行为，您应该实现它。

如上所述，菜单由视图控制，如果您检查文档和源代码，您会注意到视图有一个名为 colMenu 的属性，它指向列显示/隐藏菜单。你可以监听它的事件来实现行为。

我是如何完成这种行为的：

...
// we need to wait until the grid is rendered, because colMenu doesn't exist
// until the grid and its view is rendered.
grid.on( 'afterrender', function() 

    this.view.colMenu.on( 'itemclick', function( item, e )

        // active will contain visible columns
        var active = [], i;

        // iterate through all menu items to find checked ones
        for ( i = 0; i < this.items.items.length, i++ ) 
            if ( this.items.items[ i ].checked ) active.push( this.items.items[ i ] );
        ;

        // if there is only one active one, disable it
        if ( active.length == 1 ) 
            active[ 0 ].disable();

        // if there is more then one, enable the disabled ones
         else if ( active.length > 0 ) 
            for( i = 0; i < active.length; i++ ) 
                if ( active[ i ].disabled ) active[ i ].enable();
            
        

    // buffer is important for our itemclick event listener.
    // it'll wait 100ms after default itemclick event to finish its job.
    , this.view.colMenu,  buffer : 100  );
 );