extjs 动态表单模板二

/// <reference path="http://www.cnblogs.com/Resources/PublicJs/vswd-ext_2.0.2.js" />

var pagesize = 10;//分页大小

var record = Ext.data.Record.create([
{name : 'id' , type : 'int'},
{name : 'name' , type : 'string'},
{name : 'age', type : 'int' },
{name : 'zhiwu' , type : 'string' },
{name : 'zhichen' , type : 'string'},
{name : 'UnitName' , type : 'string'},
{name : 'fengong' , type : 'string'}
]);

var fields = [
{name : 'id' , type : 'int'},
{name : 'name' , type : 'string'},
{name : 'age', type : 'int' },
{name : 'zhiwu' , type : 'string' },
{name : 'zhichen' , type : 'string'},
{name : 'UnitName' , type : 'string'},
{name : 'fengong' , type : 'string'}
];

var toolbar = new Ext.Toolbar({
items : [
"-",
{
text : "添加",
tooltip : "添加新进度",
handler : function(){
var n = Jr_MembersGrid.getStore().getCount();//得到总行数
var p = new record({//新建一行
id : n + 1

});

Jr_MembersGrid.stopEditing();//停止编辑
ds.insert(n , p);//插入到最后一行
Jr_MembersGrid.startEditing(n , 1);//开始编辑1单元格
}
},"","-","",{
text : "删除",
tooltip : "删除进度",
handler : function(){
var rows = Jr_MembersGrid.getSelectionModel().getSelections();
if(rows.length == 0){
Ext.Msg.alert("提示","请选择一行");
}
else{
Ext.MessageBox.confirm('提示框', '您确定要进行该操作？',function(btn){
if(btn=='yes')
{
var lstAddRecord=new Array();

Jr_MembersGrid.getStore().each(function(record) {

lstAddRecord.push(record.data);
});
//                                                                                alert(Ext.encode(lstAddRecord));

Ext.Ajax.request({

url: 'Default.aspx',
method : 'POST',
params: {strJson:Ext.encode(lstAddRecord)}

});


//                                                                           
if(rows)
{
for (var i = 0; i < rows.length; i++)
{
ds.remove(rows[i]);
}
//this.getEl().dom.submit();
}        

}
});
}
}
}
]
});

//创建表格数据
var data = [

];

var ds = new Ext.data.Store({//配置数据集

autoLoad : {params : {start : 0 , limit : pagesize}},//加载时分页
reader : new Ext.data.JsonReader({
fields : fields,
root : "data",
id : "id",
totalProperty : "totalCount"
},record),
proxy : new Ext.data.HttpProxy({
url : "Data.aspx",
method : "POST"
})
});



var sm = new Ext.grid.CheckboxSelectionModel();

var Jr_MembersGrid = new Ext.grid.EditorGridPanel({

store : ds,
cm : new Ext.grid.ColumnModel({
defaults : {
align : 'center',//文本居中
width : 120,
height:60,
sortable : true
},
columns : [
//                      
sm,
{header : '序号' , dataIndex : 'id' , width : 50 , sortable : false},
{header : '姓名' , dataIndex : 'name' , width : 100 , sortable : true,
editor:new Ext.form.TextField()
// renderer : Ext.util.Format.dateRenderer('Y年m月d日')                      
},
/*      {header : '结束时间' , dataIndex : 'endTime' , width : 150 , sortable : true,
editor : new Ext.form.DateField({
format : 'Y年m月d日',
editable: false
}),
renderer : Ext.util.Format.dateRenderer('Y年m月d日')
},*/
{header : '年龄' , dataIndex : 'age' , width : 100 , sortable : true,
editor:new Ext.form.NumberField()

},
{header : '职务' , dataIndex : 'zhiwu' , width : 100 , sortable : true,
editor:new Ext.form.TextField()

},
{header : '职称' , dataIndex : 'zhichen' , width : 100 , sortable : true,
editor:new Ext.form.TextField()

},
{header : '所在单位(简称)' , dataIndex : 'UnitName' , width : 200 , sortable : true,
editor:new Ext.form.TextField()

},
{header : '分工' , dataIndex : 'fengong' , width : 320 , sortable : true,
editor : new Ext.form.TextField({

})

}
]
}),

bbar : new Ext.PagingToolbar({
store : ds,
pageSize : pagesize,
displayInfo : true,
displayMsg : "当前记录{0}--{1}条 共{2}条记录",
emptyMsg : "没有记录可显示",
prevText : "上一页",
nextText : "下一页",
lastText : "最后页",
firstText : "第一页",
beforePageText : "当前页",
afterPageText : "共{0}页"
}),
tbar : toolbar,
sm : sm,
id : 'Jr_MembersGrid',
enableColumnMove : false,
enableColumnResize : false,
columnLines : true,
autoHeight : true,
autoWidth : false ,
clickToEdit : 0,//按一下就编辑
enableHdMenu : false,
//        frame : true,//加上去会使360显示时的分页条错位
style : 'margin : 10px 0px 0px 5px',
enableColumnHide : false,
trackMouseOver : true,
stripeRows : true//斑马线效果      
});