在Extjs網格視圖中隱藏行不起作用

Question

我需要在主/細節網格中隱藏重複行。我發現這個小提琴http://jsfiddle.net/tPB8Z/1465/，隱藏了一些基於單元格的用戶選擇，但是當我在代碼http://jsfiddle.net/alebotello/axvhtrcL/21/方法addRowCls()中應用此視圖時，它不適用於行。主網格和細節網格共享同一個商店，我只想更改主網格中的行可見性，而無需修改存儲或創建新的網格。

在主電網聽衆：

afterrender: function (comp) { 
      var st = comp.getStore(); 
      var arr = []; 
      var i = 0; 
      var view = comp.getView(); 
      st.each(function (record) { 
//    console.log(record); 
       if (arr.indexOf(record.data['idOrden']) === -1) { 
        arr.push(record.data['idOrden']); 
       } else { 
        view.removeRowCls(record, 'x-grid-view'); 
        view.addRowCls(record, 'oculto'); 
//     console.log(view);      
       } 
       i++; 
      }); 

CSS

.oculto{ 
    display: none; 
} 

Answer 1

修復是很簡單的，所述主網格聽者從 'AfterRender階段' 到 'viewready' 改變。

對於大多數基於Ext.view.View的組件，例如Grid，List開發人員應該使用viewready事件而不是afterrender來執行後期渲染DOM操作。

這是記錄在他們的API文檔和指南。

viewready: function (comp) { 
     var st = comp.getStore(); 
     var arr = []; 
     var i = 0; 
     var view = comp.getView(); 
     st.each(function (record) { 
      debugger; 
      if (arr.indexOf(record.data['idOrden']) === -1) { 
       arr.push(record.data['idOrden']); 
      } else { 
       view.removeRowCls(record, 'x-grid-view'); 
       view.addRowCls(record, 'oculto'); 
       console.log(view);      
      } 
      i++; 
     }); 
    } 

工作實施例從上面的jsfiddle分叉： - http://jsfiddle.net/chetanbh/rpbdq4ex/