基本代码:

<script>
Ext.onReady(function(){

	 Ext.create('Ext.form.Panel', {
title: '登录',
bodyPadding: 5,
width: 350, // 将会通过 AJAX 请求提交到此URL
url: '${pageContext.request.contextPath}/back/login.do', // 表单域 Fields 将被竖直排列, 占满整个宽度
frame: true,
layout:'auto',
// The fields
defaultType: 'textfield',
items: [{
fieldLabel: '用户名',
name: 'name',
allowBlank: false,
blankText:'用户名不能为空'
},{
fieldLabel: '密码',
inputType:'password',
name: 'pwd',
allowBlank: false,
blankText:'密码不能为空' },{
fieldLabel: '用户类型',
name:'type',
allowBlank: false,
hidden:true, //隐藏组件 默认false
value:1//表单默认值
}
], // 重置 和 保存 按钮.
buttons: [{
text: '重置',
handler: function() {
this.up('form').getForm().reset();
}
}, {
text: '保存',
formBind: true, //only enabled once the form is valid
disabled: true,
handler: function() {
var form = this.up('form').getForm();
if (form.isValid()) {
form.submit({
success: function(form, action) {
Ext.Msg.alert('提示信息', action.result.restMsg);
},
failure: function(form, action) {
Ext.Msg.alert('提示信息', action.result.restMsg);
}
});
}
}
}],
renderTo: Ext.getBody()
});
});
</script>

  没有添加字段校验,验证码,密码加密等,只是纯粹的登录功能的实现,具体细节暂时忽略!

login.do 对应的程序:

    /**
* 登录
*
* @return
*/
@RequestMapping("/login")
@ResponseBody
public void login(@RequestParam String name,@RequestParam String pwd,@RequestParam int type,Writer writer) {
String valMsg ="";
try {
User user = new User();
user.setUname(name);
user.setPwd(pwd);
user.setUtype(type);
User getUser = userService.queryUser(user);
if(getUser!=null){
valMsg=showResultMsg(true, "登录成功");
//跳转到首页
}else {
valMsg=showResultMsg(false, "用户不存在!");
}
} catch (Exception e) {
e.printStackTrace();
valMsg=showResultMsg(true, "登录失败");
}finally {
try {
writer.write(valMsg);
} catch (IOException e) {
e.printStackTrace();
}
}
}

返回的结果:

{"result":true,"restMsg":"登录成功!"}

[extjs] ExtJs4.2 Form 表单提交的更多相关文章

  1. EXTJS4.0 form 表单提交 后 回调函数 不响应的问题

    在提交表单后,应返回一个 JSON 至少要包含{success:true} 否则,EXT 不知道是否成功,没有响应. {success:true,msg:'成功',Url:'http://www.ba ...

  2. ExtJS4为form表单必填项添加红色*标识

    通常情况下,ExtJS4的form表单必填项在输入状态下会有特殊提示,非输入状态下,显示却和其他项没有任何区别.为使必填项更加容易区分,我们需要根据allowBlank的属性值,为form表单中的必填 ...

  3. ExtJs如何判断form表单是否被修改过详解

    1.Extjs表单提交主要有三种方式: 1, EXT的form表单ajax提交(默认提交方式)      相对单独的ajax提交来说优点在于能省略写参数数组 ,form.getForm().submi ...

  4. Form表单提交数据的几种方式

    一.submit提交 在form标签中添加Action(提交的地址)和method(post),且有一个submit按钮(<input type='submit'>)就可以进行数据的提交, ...

  5. jQuery Form 表单提交插件-----formSerialize,fieldSerialize,fieldValue,resetForm,clearForm,clearFields的 应用

    一.jQuery Form的其他api  1.  formSerialize 将表单序列化成查询串.这个方法将返回一个形如: name1=value1&name2=value2的字符串.是否可 ...

  6. jQuery Form 表单提交插件----Form 简介,官方文档,官方下载地址

     一.jQuery Form简介 jQuery Form插件是一个优秀的Ajax表单插件,可以非常容易地.无侵入地升级HTML表单以支持Ajax.jQuery Form有两个核心方法 -- ajaxF ...

  7. Checkbox框全选操作,form表单提交与jquery ajax提交两种处理方式

    //1.jquery ajax<script type="text/javascript"> $(function(){ var basePath = $(" ...

  8. form表单提交

    1.form表单提交.html页面失败 <%--客户端form--%> <form id="form2" action="LoginOne.html&q ...

  9. ajax form表单提交 input file中的文件

    ajax form表单提交 input file中的文件 现今的主流浏览器由于ajax提交form表单无法把文件类型数据提交到后台,供后台处理,可是开发中由于某些原因又不得不用ajax提交文件, 为了 ...

随机推荐

  1. http请求头中的Content-Type属性在angular 和 node中的用法

    post请求的请求体有以下两种格式: 1. 字符串: 'name=code_bunny&age=12' 这种格式的请求体,需要配置请求头 'Content-Type':'application ...

  2. gnome3增加自定义程序快捷方式

    gnome3增加自定义程序快捷方式   1. 安装alacarte   在命令行输入下列命令安装alacarte程序   yum -y install alacarte   安装完毕后,在命令行输入下 ...

  3. Oracle PLSQL Demo - 15.强类型REF游标[预先指定查询类型与返回类型]

    declare Type ref_cur_emp IS REF CURSOR RETURN scott.emp%RowType; cur_emp ref_cur_emp; rec_emp cur_em ...

  4. JS移动li行数据,点击上移下移(是位置的互换,不是top的偏移量改变)

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  5. Python IDLE快捷键【转载合集】

    转载自:http://www.douban.com/note/212321426/ 编辑状态时:Ctrl + [ .Ctrl + ] 缩进代码Alt+3 Alt+4 注释.取消注释代码行Alt+5 A ...

  6. pyqt重写键盘事件+获取信号发送对象

    # _*_ coding:utf-8 _*_ import sys from PyQt4 import QtGui,QtCore class Example(QtGui.QMainWindow): d ...

  7. Path类与Directory类与File类

    阅读目录 开始 Path 对路径 字符串进行操作 获得后缀 能合并路径 获取文件名 Directory和DirectoryInfo  对目录进行操作 判断目录是否存在 创建目录 删除目录 获取目录下所 ...

  8. Java应用程序项目的打包与发行

    Java应用程序项目的打包与发行    这里主要是讲解一下怎样将 Java程序打包成独立运行的exe程序包,以下这种方法应该是最佳的解决方案了.NetDuke的EXE 程序包了是使用这种方案制作的.在 ...

  9. fullcalendar案例一<原>

    fullcalendar是个很强大的日历控件,可以用它进行排班.排会议.拍任务,很直观,用户体验良好. 看下效果图: #parse("index/head.vm") <lin ...

  10. Android Animation动画效果简介

    AlphaAnimation 淡入淡出动画  <alpha>A fade-in or fade-out animation. Represents an AlphaAnimation. a ...