环境
Extjs 4.2.1
spring MVC 3.2.12
mybatis 3.2.8
效果图
jsp:
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <% String path = request.getContextPath(); %> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>登录</title> <link href="<%=path%>/static/ext-4.2.1/resources/css/ext-all.css" rel="stylesheet" /> <script src="<%=path%>/static/ext-4.2.1/bootstrap.js"></script> <script src="<%=path%>/static/ext-4.2.1/locale/ext-lang-zh_CN.js"></script> <script type="text/javascript"> function init() { Ext.MessageBox.alert("ExtJS", "Hello ExtJS"); } //Ext.onReady(init); Ext.onReady(function(){ var form = new Ext.form.Panel({ border: false, fieldDefaults: { labelWidth: 60 }, defaultType: 'textfield', bodyPadding: 5, items: [{ xtype: 'textfield', fieldLabel: '用户名', name: 'username', value:'admin', anchor:'100%' // anchor width by percentage },{ xtype: 'textfield', inputType: 'password', fieldLabel: '密码', name: 'password', value:'123456', anchor: '100%' }] }); new Ext.window.Window({ autoShow: true, title: '登录', width: 400, height:200, minWidth: 300, minHeight: 200, layout: 'fit', plain: true, items: form, buttons: [{ text: '登录', handler: function() { login(); } },{ text: '重置', handler: function() { form.getForm().reset(); } }] }); function login(){ form.submit({ url : '<%=path%>/login.json', method : 'POST', success : function(form, action) { var msg = action.result.msg; if(msg == "success"){ location.href = "<%=path%>/"; } else { Ext.Msg.alert('提示', msg); } }, failure : function(form, action) { Ext.Msg.alert('提示', "登录请求失败!"); //var data = action.response.responseText; } }); } }); </script> </head> <body> </body> </html>
LoginController
@RequestMapping(value = "/login", method = RequestMethod.POST, produces = "application/json;charset=UTF-8") //@ResponseBody public ModelMap loginPost(HttpServletRequest request, HttpServletResponse response, ModelMap model) { //log.info("loginPost"); String username = request.getParameter("username"); String password = request.getParameter("password"); User user = userSerive.getByUserName(username); if(user == null){ model.put("success", true); model.put("msg","用户不存在!"); } else if(!user.getPassword().equals(MD5Util.encode(password+"{"+username+"}"))){ model.put("success", true); model.put("msg","密码错误!"); } else { //加载用户的角色 List<Role> roles = roleSerive.getListByUserId(user.getId()); user.setRoles(roles); request.getSession(true).setAttribute("user", user); super.setSession(request.getSession(false)); model.put("success", true); model.put("msg","success"); } return model; }