如何在ExtJS GridPanel中隐藏行？

Question

假设我知道要定位哪个行索引(例如,this.rowToBeDeleted的值为2),我怎么能只从网格而不是商店隐藏这一行(我在商店中有一个标志,表示哪些行应该稍后在我的PHP Web服务代码中从db中删除).

Answer 1

您可以使用其中一种store.filter()方法,也可以隐藏行元素.

grid.getView().getRow(rowIndex).style.display = 'none';

我认为只是从商店中删除记录并让商店更新视图要好得多,因为您要删除记录而不是隐藏它.如果存储处于批处理模式(默认值:batch:true,restful:false),它将记住您已删除的行,并且在您调用之前不会向服务器发出请求store.save().

Answer 2

在ExtJS 4.1中,没有view.getRow(..).相反,你可以使用:

this.view.addRowCls(index, 'hidden');

隐藏指定索引处的行,和

this.view.removeRowCls(index, 'hidden');

显示它('this'是网格).

CSS类hidden定义为

.hidden,
{
    display: none;
}

这对于store.filterBy()不合适的特殊情况很有用.

Answer 3

我建议使用store.FilterBy()并传递一个函数来测试rowToBedeleted中值的值:

store.filterBy(function(record) {
    return record.get("rowToBeDeleted") != 2;
});

我刚刚写了一篇关于gridfiltering的基本博文,你可以在这里阅读:http://aboutfrontend.com/extjs/extjs-grid-filter/