Extjs4 中点击grid获取单元格cell的columnIndex序号

之前可能是Extjs3.x,提供grid的有cellclick事件,能够得到列的index,

下面是一个cellclick事件
grid.addListener('cellclick', cellclick);
function cellclick(grid, rowIndex, columnIndex, e) {
    var record = grid.getStore().getAt(rowIndex);   //Get the Record
    var fieldName = grid.getColumnModel().getDataIndex(columnIndex); //Get field name
    var data = record.get(fieldName);
    Ext.MessageBox.alert('show','当前选中的数据是'+data);
}

之前可能是Extjs4.x,没有提供grid的有cellclick事件,而只是itemclick,

而itemclick中没有colIndex,只能得到行,

由于多半都是Extjs3的解答,最后找了许久,终于找个了一个Extjs4的办法,

Extjs4 中点击grid获取单元格cell的columnIndex序号_第1张图片

var gridPanel1=Ext.create('Ext.grid.Panel',{
layout:'fit',
   store:store,
   width: 500,
   selType:'checkboxmodel',
   multiSelect:true,
   renderTo:'content',
   viewConfig:{
   forceFit:true,
   scrollOffset: 0,
      columnsText: '列',
           sortAscText: '升序',
           sortDescText: '降序',
           listeners: {
       beforecellmousedown: function(view, cell, cellIdx, record, row, rowIdx, eOpts){
           if(cellIdx === 1){
              alert("dfd");
           }
       }
   }
   },
   columns:[
   {header:'证书名',dataIndex:'Certificate',flex:2},
   {header:'费用',dataIndex:'Price',flex:1},
   {header:'颁发机构',dataIndex:'Institution',flex:1},
   {
      xtype:'actioncolumn',
      items:[{
     xtype:'button',
      icon:'image/date_new.gif',
         style:{
           marginRight:'12px'
         },
                  handler: checkInfo
      },{
     icon:'image/flag_green.gif',
                  handler: selectCourse
      }]
   }
   ],
   bbar:
     Ext.create('Ext.toolbar.Paging', {
            store: store,
            pageSize : 2,  
            emptyMsg : "没有数据显示!",   
displayInfo : true,   
displayMsg : '显示 {0} - {1} 共 {2} 条',   
beforePageText : "页码 ",   
afterPageText : "共 {0} 页",   
firstText : "首页",   
lastText : "末页",   
nextText : "下一页",   
prevText : "上一页",   
refreshText : "刷新"
            
          })
          
    
});

1、 在JS中加上 Ext.QuickTips.init();
2、重写renderer方法
      {
        header:'项目',
        dataIndex:'item',
        renderer:function(data, metadata, record, rowIndex, columnIndex, store){
            metadata.attr = 'ext:qtip="' + data + '"';  
            return data;
     }
 }




你可能感兴趣的:(Extjs4 中点击grid获取单元格cell的columnIndex序号)