代码如下:
Ext.onReady(function(){
//alert('center');
Ext.define('user',{
extend:'Ext.data.Model',
fields:['name','email']
});
var Gstore = Ext.create('Ext.data.Store', {
//storeId:'user',
model:'user',
data:[
{ 'name': 'Lisa', "email":"lisa@simpsons.com"},
{ 'name': 'Bart', "email":"bart@simpsons.com"},
{ 'name': 'Homer', "email":"home@simpsons.com"},
{ 'name': 'Marge', "email":"marge@simpsons.com"}
]
// proxy: {
// type: 'memory',
// reader: {
// type: 'json',
// root: 'items'
// }
// }
});
Ext.create('Ext.grid.Panel',{
//title:'add',
store: Gstore,//Ext.data.StoreManager.lookup('user'),
columns:[{text:'name',dataIndex: 'name'},
{text:'email',dataIndex: 'email',
//为达到可编辑的目的 列模式要重构 这里举着一个为例
// field:{
// xtype:''
// }
editor: 'textfield'
}
],
selType: 'checkboxmodel', // checkbox 复选框
multiSelect : true,//控制可以多选
height: 400,
width: '100%',
frame:true,//让Grid 有个边框(饱满一些)
forceFit:true,//让columns栏充满整个宽度
//draggable: true,
tbar:[{xtype:'button', text:'Add'},'-',
{xtype:'button', text:'Delete', handler:function(b){
/*向上得到父控件方法
* 1.通过findParentByType('gridpanel')方法
* 2.通过ownerCt属性
*/
//var grid=b.findParentByType('gridpanel');
var grid=b.ownerCt.ownerCt;
/*下面得到被选中的行
* 1.用上面的grid调用getSelectionModel()得到该grid的选择模式 将返回一个Ext.selection.Model
* 2.然后调用该Ext.selection.Model的.getSelection()方法得到一个Ext.data.Model[]
* 此时被选中的行已经被得到了
*/
var sel=grid.getSelectionModel().getSelection();
if(sel.length == 0){
alert('you should choose one');
}else{
//下面做简单删除
var store=grid.getStore();
Ext.Array.each(sel,function(record){
store.remove(record);
});
}
}},'-',
{xtype:'button', text:'Edit'}
],
dockedItems:[
{xtype: 'pagingtoolbar', //翻页工具条
dock: 'bottom' // 置于底部 (用bottom)
}
],
/*让每一行可编辑
*用plugins配置Ext.grid.plugin.CellEditing插件,
*然后列模式要重构
*/
plugins: [
Ext.create('Ext.grid.plugin.CellEditing', {
clicksToEdit: 2
})
],
renderTo: Ext.getBody()
});
//alert('aaaaaa');
});