Ext.grid.EditorGridPanel的使用、修改记录的获取及提交
来源:互联网 发布:淘宝首页怎么建热点 编辑:程序博客网 时间:2024/06/06 14:23
<HTML>
<HEAD>
<TITLE>可编辑表格面板EditorGridPanel</TITLE>
<metahttp-equiv="Content-Type" content="text/html;charset=utf-8">
<link rel="stylesheet"type="text/css" href="extjs2.0/resources/css/ext-all.css"mce_href="extjs2.0/resources/css/ext-all.css"/>
<mce:scripttype="text/javascript" src="extjs2.0/adapter/ext/ext-base.js"mce_src="extjs2.0/adapter/ext/ext-base.js"></mce:script>
<mce:scripttype="text/javascript" src="extjs2.0/ext-all.js"mce_src="extjs2.0/ext-all.js"></mce:script>
<mce:scripttype="text/javascript"src="extjs2.0/source/locale/ext-lang-zh_CN.js"mce_src="extjs2.0/source/locale/ext-lang-zh_CN.js"></mce:script>
<mce:scripttype="text/javascript"><!--
Ext.onReady(function(){
Ext.BLANK_IMAGE_URL ='../../extjs2.0/resources/images/default/s.gif';
Ext.QuickTips.init();
Ext.form.Field.prototype.msgTarget ='qtip';
//创建表格数据
var data =[
[1,'张三','男',newDate(1979,09,13),29,'zhang@abc.com'],
[2,'李四','女',newDate(1978,10,01),30,'li@abc.com'],
[3,'王五','男',newDate(1981,01,01),27,'wang@abc.com']
];
//创建记录类型Person,mapping值为字段值对应数组中数据的索引位置
var Person =Ext.data.Record.create([
{name:'personId',mapping:0},
{name:'personName',mapping:1},
{name:'personSex',mapping:2},
{name:'personBirthday',mapping:3},
{name:'personAge',mapping:4},
{name:'personEmail',mapping:5}
]);
var dataStore=newExt.data.Store({//配置数据集
reader: newExt.data.ArrayReader({id:0},Person),
data: data
});
//创建Grid表格组件
var grid = newExt.grid.EditorGridPanel({
title :'Ext.grid.EditorGridPanel',
applyTo :'grid-div',
width:430,