一个简单的Extjs3.0表单提交实例

最新推荐文章于 2018-09-05 14:06:37 发布

rootless

最新推荐文章于 2018-09-05 14:06:37 发布

阅读量4k

点赞数

分类专栏： ExtJS 文章标签： extjs function email stylesheet string action

本文链接：https://blog.csdn.net/rootless/article/details/5334517

版权

ExtJS 专栏收录该内容

0 篇文章 0 订阅

订阅专栏

效果图：

代码界面效果图

jsp展现页面代码：

<%@page contentType="text/html;charset=GBK" %>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=GBK">

js代码：

Ext.onReady(onReadyFn); function onReadyFn(){ Ext.QuickTips.init(); // turn on validation errors beside the field globally Ext.form.Field.prototype.msgTarget = 'side'; var simple = new Ext.FormPanel({ labelWidth: 75, // label settings here cascade unless overridden url:'TestForm1Save.jsp', frame:true, title: 'Simple Form', bodyStyle:'padding:5px 5px 0', width: 350, defaults: {width: 230}, defaultType: 'textfield', items: [{ fieldLabel: '姓名', name: 'Name1', allowBlank: false, blankText: "姓名不能为空", labelSeparator:'：' },{ fieldLabel: '密码', name: 'Password', allowBlank: false, inputType: "password", blankText: "密码不能为空", labelSeparator:'：' },new Ext.form.Hidden({ fieldLabel: 'TestHidden', name: 'TestHidden' }),{ fieldLabel: 'Email', name: 'Email', vtype:'email' }, new Ext.form.TimeField({ fieldLabel: 'Time', name: 'Time', minValue: '8:00am', maxValue: '6:00pm' }) ], buttons: [{ text: 'Save', handler:function(){ if(!check()){ return false; } if(simple.form.isValid()){ showProcess(); //自定义，在common/extjs-assis/ext-self.js下 //获取控件的值 //alert("您录入的是：" + simple.getForm().findField('Name1').getValue() + ", " + simple.getForm().findField('Email').getValue()); simple.getForm().findField('TestHidden').setRawValue("Hidden Field Test Value"); this.setDisabled(true); simple.getForm().submit({ url:'TestForm1Save.jsp', method:'post', params:'', success:function(form,action) { Ext.MessageBox.alert('提示',"操作成功，" + action.result.msg); }, failure:function(form,action){ Ext.MessageBox.alert('提示','操作失败，' + action.result); } }); this.setDisabled(false); } else{ Ext.MessageBox.alert("提示", "请正确录入数据。"); return false; } } },{ text: 'Cancel', handler:function(){ simple.form.reset(); } }] }); simple.render("FormDiv"); } function check(){ //alert("校验函数"); return true; }

后台JSP代码：

<%@page contentType="text/html;charset=GBK" %> <% String tName = request.getParameter("Name1"); String tTestHidden = request.getParameter("TestHidden"); String tEmail = request.getParameter("Email"); //String rs = "{failure:true,msg:/'你录入的是：姓名：" + tName + ", TestHidden：" + tTestHidden + ", Email：" + tEmail + "/'}"; String rs = "{success:true,msg:/'你录入的是：姓名：" + tName + ", TestHidden：" + tTestHidden + ", Email：" + tEmail + "/'}"; System.out.println(rs); out.write(rs); %>

rootless

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
2
评论
一个简单的Extjs3.0表单提交实例

效果图： jsp展现页面代码：%@page contentType="text/html;charset=GBK" %> TestForm js代码：Ext.onReady(onReadyFn);function onReadyFn(){ Ext.QuickTips.init(); /
复制链接

扫一扫