<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>Demo.html</title> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> <meta http-equiv="description" content="this is my page"> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <link rel="stylesheet" type="text/css" href="../ext/resources/css/ext-all.css" mce_href="ext/resources/css/ext-all.css"/> <mce:script type="text/javascript" src="../ext/adapter/ext/ext-base.js" mce_src="ext/adapter/ext/ext-base.js"></mce:script> <mce:script type="text/javascript" src="../ext/ext-all.js" mce_src="ext/ext-all.js"></mce:script> <mce:script type="text/javascript"><!-- Ext.onReady(function(){ Ext.QuickTips.init(); Ext.form.Field.prototype.msgTarget='qtip'; var data=[ [1,'诸葛亮','男',new Date(1900,09,09),30,'zhugeliang@abc.com'], [2,'赵云','男',new Date(1900,09,09),23,'zhaoyun@abc.com'], [3,'曹操','男',new Date(1900,09,09),36,'caocao@abc.com'], [4,'关羽','男',new Date(1900,09,09),34,'guanyu@abc.com'] ]; var Person=Ext.data.Record.create([ {name:'id',mapping:0}, {name:'name',mapping:1}, {name:'sex',mapping:2}, {name:'birthday',mapping:3}, {name:'age',mapping:4}, {name:'email',mapping:5} ]); var grid=new Ext.grid.EditorGridPanel({ title:'Ext.grid.EditorGridPanel 示例', applyTo:'grid', width:500, height:180, frame:true, store:new Ext.data.Store({ reader:new Ext.data.ArrayReader({id:0},Person), data:data }), columns:[ {header:'id',width:40,dataIndex:'id'}, {header:'姓名',width:100,dataIndex:'name', editor:new Ext.form.TextField({ allowBlank:false })}, {header:'性别',width:40,dataIndex:'sex', editor:new Ext.form.ComboBox({ editable:false, displayField:'sex', mode:'local', triggerAction:'all', store:new Ext.data.SimpleStore({ fields:['sex'], data:[['男'],['女']] }) }) }, {header:'出生日期',width:100,dataIndex:'birthday', editor:new Ext.form.DateField(), renderer:Ext.util.Format.dateRenderer('Y年m月d日') }, {header:'年龄',width:40,dataIndex:'age', editor:new Ext.form.NumberField() }, {header:'Email',width:150,dataIndex:'email', editor:new Ext.form.TextField({ vtype:'email' }) } ] }); }); // --></mce:script> </head> <body> <div id="grid"></div> </body> </html> 输入的Email格式不对时,会显示警告信息: