Ext表单的一些应用

表单验证

• FormPanel创建之前需要做一些初始化工作
  

//验证失败，提示信息显示初始化(msgTarget为side和qtip时有用)

Ext.QuickTips.init();

//设置验证失败后，默认验证失败信息显示模式(共5种qtip,title,under,side,[element id],可参见Field的msgTarget属性)

Ext.form.Field.prototype.msgTarget = 'side';

• Field的设置验证的属性是validator（可参见Field的validator属性，当返回true时表示验证通过，返回其它则验证失败并认为是验证失败的提示信息）
  

validator:function(val){if(val=='xiangqian'){return true;}else{return 'please input xiangqian';}}

表单提交

simple.getForm().submit({url:'<c:url value="/pages/ext/response.jsp"/>',method:'POST',waitMsg:'正在提交...',success:function(form,action){ Ext.Msg.alert('Success', action.result.msg);},failure:function(form,action){switch (action.failureType) {//如果表单验证未通过case Ext.form.Action.CLIENT_INVALID:Ext.Msg.alert('Failure', 'Form fields may not be submitted with invalid values');break;//如果Ajax调用时连接失败case Ext.form.Action.CONNECT_FAILURE:Ext.Msg.alert('Failure', 'Ajax communication failed');break;//如果服务端调用时success属性值为非(true或'true')时case Ext.form.Action.SERVER_INVALID:   Ext.Msg.alert('Failure', action.result.msg);   }}});

提交表单时使用BasicForm的submit方法。表单提交后，有两个回调函数succcess和failure。

回调success函数情况有1种：

1. 服务端响应并且成功，内容格式是{success:true,msg:'successful'}，必须包括属性名success，如果属性名success的值为true或者'true'，则表示成功

回调failure函数情况有3种：

1. 表单提交时action.failureType值为Ext.form.Action.CLIENT_INVALID，表示客户端验证失败
2. 表单提交时action.failureType值为Ext.form.Action.CONNECT_FAILURE，表示提交时连接失败
3. 表单提交时action.failureType值为Ext.form.Action.SERVER_INVALID，表示提交时服务端响应失败，响应内容中属性名success的值非(true或'true')，则表示服务端响应失败