EXTJS 4.2 grid get column header name on cell click with custom multi cell selection model

Question

I have already tried grid.getColumnModel().getColumnHeader(columnIndex); but this doesn't work. I am using a custom grid selection model.I want to get column header value whenever any cell in corresponding column is clicked

Answer 1

You need to add cellClick listener to the panel, here is the modified code

var grid1 = Ext.create('Ext.grid.Panel', {
  renderTo: Ext.getBody(),
  store: store,
  width:0.3*Ext.getBody().getViewSize().width,
  height: 0.5*Ext.getBody().getViewSize().height,
  columnLines: true,
  columns: [{
      text     : 'Company',
      locked   : true,
      sortable : false,
      dataIndex: 'company',
      renderer : function (value, metaData, record, row, col, store,gridView)                {
    metaData.tdAttr = 'data-qtip="' + value + '"';
    return value;
 }
 },{
    text     : 'Price',
    width    : 125,
    locked:true,
    sortable : true,
    renderer : 'usMoney',
    dataIndex: 'price',
  },{
    text     : 'Change',
    width    : 555,
    sortable : true,
    dataIndex: 'change',
    renderer : function (value, metaData, record, row, col, store, gridView)  {
    metaData.tdAttr = 'data-qtip="' + value + '"';
    return value;
  }
  },{
      text     : '% Change',
      width    : 555,
      sortable : true,
      renderer : pctChange,
      dataIndex: 'pctChange',
  },{
      text     : 'Last Updated',
      width    : 555,
      sortable : true,
      renderer : Ext.util.Format.dateRenderer('m/d/Y'),
      dataIndex: 'lastChange'
      }],
  title: 'Locking Grid Column',
  selType: 'cellmodel',
  selModel: Ext.create('MyApp.MultiCellSelectionModel',{
          mode: 'MULTI',
          allowDeselect: true
         }),
           multiSelect: true,
           listeners : {
                 cellclick( grid, cell, columnIndex, record , node , rowIndex , evt){
             var cellId = grid.getHeaderCt().getHeaderAtIndex(columnIndex).id;
                        var dataIndex = grid.getHeaderCt().getHeaderAtIndex(columnIndex).dataIndex; 

                        var text =  grid.getHeaderCt().getHeaderAtIndex(columnIndex).text; 

                        alert(dataIndex);
                        alert(text);
                    }
  }
 });