ExtJS：隐藏列的神奇之处

Question

我想知道ExtJS如何隐藏列而没有任何可见的CSS更改！

我遇到的问题 - 我无法设置CSS规则来隐藏隐藏列中的子图标。 F.E.如果隐藏的td有类'隐藏'，我可以使用类似的东西：

td.hidden img {display:none;}

但在这种情况下，我只能在渲染器中操作grid.columns [col] .isHidden（）。

renderer: function(value,td,record,row,col,store,view) {
    return grid.columns[col].isHidden() ? '' : someFunctionToRenderColumn();
},

没关系，但是如果我显示隐藏的列，它将不会刷新网格并显示空列。当然，我可以添加一个事件来显示/隐藏该列，但它太难了！它有什么简单的方法吗？

Answer 1

它给出了宽度为0px：

<colgroup>
    <col class="x-grid-cell-gridcolumn-1023" style="width: 0px;">
</colgroup>

......那也应该隐藏你的img。除非你给他们一个绝对的定位或什么。您应尝试使用img，float和margin来定位padding。或者，您必须使用该列的'hidden'和hide事件自行切换show课程。

Answer 2

您可以通过定位相应的col元素来隐藏列。无需在每个td上添加课程。

这是我之前提出的一个小提琴：http://jsfiddle.net/MrLister/MupLH/

<table>
  <col><col class="invisible"><col>
  ...

和CSS：

.invisible {visibility:collapse}

但你甚至不需要上课;如果您知道列号，也可以使用col:nth-child(2)。