使用PivotGrid的ExtJS單元格選擇模型不起作用

Question

我在嘗試更改PivotGrid的SelectionModel，但它不起作用。這是我的代碼。有人能說出我做錯了什麼嗎？

我需要使用cellSelectionModel，因爲我想深入瞭解，並且需要頂部和左側軸來獲取交點。

我也試過EXTJS 3.3 API中的'cellclick'事件，但沒有運氣。任何人都會獲得除默認RowSelectionModel以外的選擇模型？

var pivotAccumGrid = new Ext.grid.PivotGrid({ 
    store  : my_store, 
    aggregator: 'count', 
    measure : 'my_field', 
    sm: new Ext.grid.CellSelectionModel({ //I have also tried selModel for key 
     listeners: { 
      cellselect: function(sm,row,col) { 
       Ext.Msg.alert('click','got a click!'); 
      } 
     } 
    }), 
    topAxis: [ {dataIndex: 'top_field'},{dataIndex: 'top_field2'} ], 
    leftAxis: [ {dataIndex: 'left_field', width: 80} ], 
}); 

Answer 1

這是一個快速解決方案，在PivotGridView這樣以後就可以使用回退小區索引引入了一個新的屬性meta。大部分代碼沒有任何區別，只是meta.id在renderRows的引入和meta.id在getCellIndex的分裂。

Ext.override(Ext.grid.PivotGridView, {  
    renderRows : function(startRow, endRow) { 
     var grid   = this.grid, 
      rows   = grid.extractData(), 
      rowCount  = rows.length, 
      templates  = this.templates, 
      renderer  = grid.renderer, 
      hasRenderer = typeof renderer == 'function', 
      getCellCls = this.getCellCls, 
      hasGetCellCls = typeof getCellCls == 'function', 
      cellTemplate = templates.cell, 
      rowTemplate = templates.row, 
      rowBuffer  = [], 
      meta   = {}, 
      tstyle  = 'width:' + this.getGridInnerWidth() + 'px;', 
      colBuffer, column, i; 

     startRow = startRow || 0; 
     endRow = Ext.isDefined(endRow) ? endRow : rowCount - 1; 

     for (i = 0; i < rowCount; i++) { 
      row = rows[i]; 
      colCount = row.length; 
      colBuffer = []; 

      rowIndex = startRow + i; 

      //build up each column's HTML 
      for (j = 0; j < colCount; j++) { 
       cell = row[j]; 

       meta.id = i + '-' + j; 
       meta.css = j === 0 ? 'x-grid3-cell-first ' : (j == (colCount - 1) ? 'x-grid3-cell-last ' : ''); 
       meta.attr = meta.cellAttr = ''; 
       meta.value = cell; 

       if (Ext.isEmpty(meta.value)) { 
        meta.value = '&#160;'; 
       } 

       if (hasRenderer) { 
        meta.value = renderer(meta.value); 
       } 

       if (hasGetCellCls) { 
        meta.css += getCellCls(meta.value) + ' '; 
       } 

       colBuffer[colBuffer.length] = cellTemplate.apply(meta); 
      } 

      rowBuffer[rowBuffer.length] = rowTemplate.apply({ 
       tstyle: tstyle, 
       cols : colCount, 
       cells : colBuffer.join(""), 
       alt : '' 
      }); 
     } 

     return rowBuffer.join(""); 
    }, 

    getCellIndex : function(el) { 
     if (el) { 
      var match = el.className.match(this.colRe), 
       data; 

      if (match && (data = match[1])) { 
       return parseInt(data.split('-')[1], 10); 
      } 
     } 
     return false; 
    } 
});