Ext——异步加载表单

Ext代码如下

<script>
	Ext.onReady(function(){
		Ext.QuickTips.init();//开启表单提示
		Ext.form.Field.prototype.msgTarget='side';//设置提示信息位置为边上
		var simple = new Ext.FormPanel({//初始化表单面板
			labelWidth:75,//默认标签宽度
			buttonAlign:'left',//按钮左对齐
			frame:true,//设置表单面板，false为无面板
			title:'我的表单',
			bodyStyle:'padding:5px 5px 0',
			width:350,
			defaults:{width:230},
			waitMsgTarget:true,//加载提示
			defaultType:'textfield',//默认字段类型
			reader:new Ext.data.XmlReader({//设置数据来源为xml
				record:'contact',//XML数据dom结点
				success:'@success'//加载成功后不作处理
			},[
				'name',
				'email'//取得XML节点数据填充到表单对应字段
			]),
			
			items:([{
				fieldLabel:'帐户',
				name:'name'
			},{
				fieldLabel:'e-mail',
				name:'email'
			}]),
			
			buttons:[{
				text:'加载',
				handler:function(){
					simple.form.load({url:'form_info.xml',waitMsg:'Loading'})//加载XML数据文件('form_info.xml)
				}
			}]
		});
	simple.render('show');//添加到指定区域(添加到一个div中)
	});   
</script>

 

Xml数据代码

<?xml version="1.0" encoding="UTF-8"?>
<response success="true">
	<contact><!--对应record : 'contact'，其中包含所需的数据-->
		<name>leehui1983</name><!--字段-->
		<email>nicho-li@163.com</email><!--字段-->
	</contact>
</response>