03-jquery-easy-ui与SpringMvc结合登录示例

最新推荐文章于 2024-08-07 09:33:53 发布

iteye_17825

最新推荐文章于 2024-08-07 09:33:53 发布

阅读量112

点赞数

分类专栏： SpringMvc+Hibernate+jquery整合系列文章标签： json jquery-easyui SpringMvc @RequestMapping @ResponseBody

SpringMvc+Hibernate+jquery整合系列专栏收录该内容

3 篇文章 0 订阅

订阅专栏

此篇博文仅代表个人观点，由于本人经验尚浅，如有错漏之处请私信指正，谢谢

准备工作，下载jquery-easyui-1.3.3.zip,以及jquery-2.0.0.js，将其放入WebRoot下，建立文件JS
为了页面引用easyui方便，建立jquery.jsp


<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link rel="stylesheet" href="${pageContext.request.contextPath}/js/jquery-easyui-1.3.3/themes/default/easyui.css" type="text/css"></link>
<script src="${pageContext.request.contextPath}/js/jquery-2.0.0.js" type="text/javascript" charset="utf-8"></script>
<script src="${pageContext.request.contextPath}/js/jquery-easyui-1.3.3/jquery.easyui.min.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery-easyui-1.3.3/locale/easyui-lang-zh_CN.js" charset="utf-8"></script>

然后创建登录页面


<%@ page language="java" import="java.util.*" contentType="text/html;charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>

<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>

  <jsp:include page="jquery.jsp"></jsp:include>
  <base href="<%=basePath%>">

   <title>登录</title>


<script type="text/javascript">
   $(function(){


  	$('#dd').dialog({   
    title: '登录',   
    closed: false,   
    cache: false,   
    closable:false,
    modal: false,
    shadow:false,

		buttons:[{
				text:'登录',
				handler:function(){
					$.messager.progress();	// display the progress bar
					$('#login_form').form('submit', {
						url:'${pageContext.request.contextPath}/userController/login',
						onSubmit: function(){
							var isValid = $(this).form('validate');
							if (!isValid){
								$.messager.progress('close');	// hide progress bar while the form is invalid
							}
							return isValid;	// return false will stop the form submission
						},
						success: function(data){
							 var data = eval('(' + data + ')');  // change the JSON string to javascript object   
						        if (data.success){   

						        	  $.messager.progress('close');	
						        	//  alert(data.msg);
						      			location.replace("${pageContext.request.contextPath}/index.jsp");
						        	 // window.location.href="${pageContext.request.contextPath}/index.jsp"; 
						        	 // window.redirect('${pageContext.request.contextPath}/index.jsp',_self)	;		          

						        }   else{
						        	  $.messager.progress('close');	
						        	  $.messager.alert('错误', data.msg, 'error');
						        }



						}
					});

				}


			},{
				text:'重置',
				handler:function(){
					$('#login_form').form('clear');


				}
			}]
				}
		);  

  	$('#dd').dialog('center');

   } );

  </script>
  </head>

  <body>
 	[align=center" width="280px" height="100px" >
    <tr height="20px]
    <td align="right" height="20px">用户名:</td><td height="20px"><input id="user_name" name="login_name" class="easyui-validatebox"   required="required" /></td>
    </tr>
    <tr height="20px">
    <td align="right" height="20px">密码:</td><td height="20px"><input id="password" name="passwd" type="password" class="easyui-validatebox"   required="required" /></td>
    </tr>
    </table>

    </form>
  [/align]
  </body>
</html>

以及userController,由于是示例，就任意账号密码都能登录成功


package cn.cy.controller;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;

import cn.cy.dto.Json;
import cn.cy.dto.TuserDto;
@Controller
@RequestMapping("/userController")
public class UserController {
	@RequestMapping("/login")
	@ResponseBody
    public Json login(TuserDto user){
    	Json json  = new Json();
    	json.setSuccess(true);
    	json.setMsg("OK");
    	return json;

    }
}

Json类代码为


package cn.cy.dto;


public class Json implements java.io.Serializable {

	private boolean success = false;

	private String msg = "";

	private Object obj = null;

	public boolean isSuccess() {
		return success;
	}

	public void setSuccess(boolean success) {
		this.success = success;
	}

	public String getMsg() {
		return msg;
	}

	public void setMsg(String msg) {
		this.msg = msg;
	}

	public Object getObj() {
		return obj;
	}

	public void setObj(Object obj) {
		this.obj = obj;
	}

}

TuserDto 类代码为


package cn.cy.dto;

import java.util.Date;

import org.springframework.format.annotation.DateTimeFormat;

import cn.cy.model.Tdept;

public class TuserDto {
	private String user_id;
	private String login_name;
	private String passwd;
	private String real_name;
	private String phone_number;
	private String dept_id;
	private String group_ids;

	public String getUser_id() {
		return user_id;
	}
	public void setUser_id(String user_id) {
		this.user_id = user_id;
	}
	public String getLogin_name() {
		return login_name;
	}
	public void setLogin_name(String login_name) {
		this.login_name = login_name;
	}
	public String getPasswd() {
		return passwd;
	}
	public void setPasswd(String passwd) {
		this.passwd = passwd;
	}
	public String getReal_name() {
		return real_name;
	}
	public void setReal_name(String real_name) {
		this.real_name = real_name;
	}
	public String getPhone_number() {
		return phone_number;
	}
	public void setPhone_number(String phone_number) {
		this.phone_number = phone_number;
	}
	public String getDept_id() {
		return dept_id;
	}
	public void setDept_id(String dept_id) {
		this.dept_id = dept_id;
	}
	public String getGroup_ids() {
		return group_ids;
	}
	public void setGroup_ids(String group_ids) {
		this.group_ids = group_ids;
	}





}

iteye_17825

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
03-jquery-easy-ui与SpringMvc结合登录示例

此篇博文仅代表个人观点，由于本人经验尚浅，如有错漏之处请私信指正，谢谢准备工作，下载jquery-easyui-1.3.3.zip,以及jquery-2.0.0.js，将其放入WebRoot下，建立文件JS 为了页面引用easyui方便，建立jquery.jsp[code="html"][/c...
复制链接

扫一扫