如何在extjs 3网格面板中显示/隐藏列

我有一个网格面板，我需要根据复选框的值显示/隐藏网格面板中的列。如果复选框被选中，我需要在网格中显示列，如果未选中，我需要隐藏网格中的列。如何在extjs 3网格面板中显示/隐藏列

这里是我的代码

var chkEnableDisplayResponsibilityForAction = '<%=Session["chkEnableDisplayResponsibilityForAction"]%>'; 

var flags = Boolean.parse(chkEnableDisplayResponsibilityForAction); 
var flags1 = !Boolean.parse(chkEnableDisplayResponsibilityForAction) 

var colModel = new Ext.grid.ColumnModel([ 
{ header: "PricePlanID", width: 100, sortable: true, dataIndex: 'PricePlanID', hidden: flags, hideable: flags1 }, 
    ]);

当我刷新我不能够根据复选框的值切换栏的页面。但是，当我登录并注销时，我可以看到网格面板中的更改。任何人都可以帮助我刷新网格面板中的列值吗？

来源

2009-11-25 xrx215

18K视图在两分钟内..... – starbeamrainbowlabs 2012-07-25 12:22:02

ExtJs的4：http://stackoverflow.com/questions/6042138/extjs4-what-is-the-equivalent-to-the-grid-columnmodel – Justin 2012-07-30 17:12:29

可能重复[ExtJs4 - 什么是相当于电网ColumnModel？]（https://stackoverflow.com/questions/6042138/extjs4-what-is-the-equivalent-to-the-grid-columnmodel） – durtto 2017-09-14 20:11:54

如果看看ExtJS API，特别是ColumModel有一个setHidden方法，它会隐藏/显示GridPanel中的列。

myGrid.getColumnModel().setHidden(0, true);

你也应该挂钩onchange事件的复选框，这样你可以显示或隐藏的列

来源

2009-11-25 15:29:27 RageZ

复选框在设置了标志的另一个页面中，根据网格面板中标志列的值是可见的还是隐藏的。它现在正在运行完美。感谢您的回复。 – xrx215 2009-11-25 16:14:20

这在4.0以上不推荐使用 – 2013-12-26 23:18:19

可以使用列标题菜单显示/隐藏列 - 你可以选择你想拥有哪列所示。无论如何，如果你想显示/隐藏的列，试试这个

myGrid.getColumnModel().setHidden(0, true);

来源

2009-11-25 15:30:06

谢谢。它正在工作:) – xrx215 2009-11-25 16:10:15

在Ext JS的4.1，到隐藏的列，您可以使用：

grid.columns[0].setVisible(false);

貌似getColumnModel（）及其setHidden（）方法不再是网格的一部分： http://docs.sencha.com/ext-js/4-1/#!/api/Ext.grid.Panel

来源

2012-07-25 12:18:22 Tom

应setVisible（false）; – Marshal 2013-03-28 01:23:10

由于元帅:) – Tom 2013-03-28 12:54:39

简写：grid.columns [0] .hide（） http://docs.sencha.com/ext-js/4-1/source/AbstractElement.html#Ext-dom-AbstractElement-method这里在于-HIDE – v1r00z 2013-04-12 14:21:13

在ExtJS 4中获取对您的网格面板的访问权限，然后访问Column对象的列数属性。

从那里你可以使用数组迭代器方法（http://www.diveintojavascript.com/core-javascript-reference/the-array-object）来执行一个动作。

在下面的示例中，我根据标题名称隐藏并显示了一些列，但显然可以根据任何Column属性执行操作。

var grid = Ext.getCmp('my_grid_panel'); 

grid.columns.forEach(function(col) { 
    if((col.text == "Foo") || (col.text == "Bar")) { 
     col.setVisible(true); 
    } else if(col.text == "Baz") { 
     col.setVisible(false); 
    } 
});

来源

2012-07-25 15:46:09 Poul

的唯一问题 - 说，有6列最初要显示过去，然后只显示如果复选框被选中的第六位。在我上面的代码中，它显示了所有六列[col.hidden = true]在这种情况下起作用。因此，我最初设置隐藏为真正的所有列。并在beforerender中运行此代码。这有效 – 2014-12-08 19:41:08

上面的答案我觉得很不错。但让我给你一个建议。

1）在ExtJS的4.x的它建议使用Ext.ComponentQuery单曲方法而不是Ext.getCmp（）

2）隐藏/显示的网格的列你可以使用下面的代码

Ext.ComponentQuery.query('grid gridcolumn[dataIndex^="service"]')[0].hide()

或显示

Ext.ComponentQuery.query('grid gridcolumn[dataIndex^="service"]')[0].show()

它应该解决隐藏/显示网格中的任何列。

这里网格是你的网格，它可能是id或xtype等。

来源

2016-08-16 09:00:39 Almas

setVisibleColumn  : function(name, flag) { 
    name = Ext.Array.from(name); 
    var column; 

    for (var i = 0; i < name.length; i++) { 
     column = this.getColumn(name[i]); 
     if (column) { 
      flag ? column.show() : column.hide(); 
     } 
    } 

}

来源

2017-07-17 19:17:22

你可以给你的答案添加一些解释吗？ – 2017-07-17 20:07:37

如何在extjs 3网格面板中显示/隐藏列

回答

相关问题