Extjs4 Grid单击事件

var grid = Ext.create('Ext.grid.Panel', {
id: 'viewVioForce_grid',
store: store,
columns: [
new Ext.grid.RowNumberer(),
{header: 'ProcessDefinitionId', sortable: true, dataIndex: 'id', align:'left', width:150},
{header: 'DeploymentId', sortable: false, dataIndex: 'deploymentId', align:'left', width:100},
{header: '名称', sortable: false, dataIndex: 'name', align:'left', width:150},
{header: 'KEY', sortable: false, dataIndex: 'key', align:'left', width:150},
{header: '版本号', sortable: false, dataIndex: 'version', align:'left', width:80},
{header: 'XML', sortable: false,dataIndex: 'resourceName', align:'left', width: 150,renderer:function(val){return '<span style="cursor:pointer;"><font color=blue>'+val+'</font></span>'}},
{header: '图片', sortable: true, dataIndex: 'diagramResourceName', align:'center', width:150,renderer:function(val){return '<span style="cursor:pointer;"><font color=blue>'+val+'</font></span>'}},
{header: '部署时间', sortable: true, dataIndex: 'deploymentTime', align:'center', width:150},
{header: '是否挂起', sortable: true, dataIndex: 'suspended', align:'center', width:150,
renderer:function(val){ return val=="true"?val+"|"+"<span style='cursor:pointer;'><font color=blue>激活</font></span>":val+"|"+"<span style='cursor:pointer;'><font color=blue>挂起</font></span>";
}},
{header: '操作', sortable: true, dataIndex: 'cd', align:'center', width:150,renderer:function(val){return '<span style="cursor:pointer;"><font color=blue>删除</font></span>'}}
],
stripeRows: true,
autoWidth: true,
frame: false,
fixed: true,
region: 'center',
animCollapse: false,
viewConfig: {
loadingText: 'Loading...'
},
bbar: Ext.create('Ext.PagingToolbar', {
pageSize: 1,
store: store,
displayInfo: true,
//plugins: Ext.create('Ext.ux.ProgressBarPager', {}),
displayMsg: '显示第 {0} 条到 {1} 条记录，一共 {2} 条',
emptyMsg: "没有记录"
}),
buttonAlign:'left'
});

ExtJS3 Grid 中 单击行和单元格获得行或者单元格的内容(数据)

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 column中整合了ColumnModel ，故此gird的中无getColumnModel()。

ExtJS4 Grid 中 单击行和单元格获得行或者单元格的内容(数据)

grid.on("cellclick",function( grid, rowIndex, colIndex,record,event )

       var column = grid.getHeaderAtIndex(colIndex);

       var dataIndex = column.dataIndex;

       var recs = grid.getSelectionModel().getSelection();

       if(fieldName=='cd'){

         Ext.Msg.show({

title: '提示',
msg: '确定删除选中记录？',
buttons: Ext.Msg.YESNO,
fn: function(conf) {
if(conf == 'yes') {
Ext.getCmp('ext-form-delete').getForm().submit({
url: approot + '/****/delete.action',
method: 'post',
waitMsg: '数据处理中...',
params: {
'deploymentId' : record.data.deploymentId
},
success: function(form, action) {
Ext.Msg.show({
title: '提示',
msg: action.result.msg,
buttons: Ext.Msg.OK,
fn: function() {
store.load();
}
});
},
failure: function(form, action) {
Ext.Msg.alert('提示', action.result.msg);
}
});
}
},
icon: Ext.Msg.QUESTION
});
});

从Extjs4API中   事件：
( Ext.view.Table this, HTMLElement td, Number cellIndex, Ext.data.Model record, HTMLElementtr, Number rowIndex,Ext.EventObject e, Object eOpts )

单击表格单元格时触发。

Parameters

 

posted @ 2014-03-01 10:15  Akuikly  阅读(1945)  评论(0)    收藏  举报