此篇博文仅代表个人观点,由于本人经验尚浅,如有错漏之处请私信指正,谢谢
准备工作,下载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;
}
}
分享到:
相关推荐
本资源是本人将SpringMVC + jQuery easy ui整合的CRUD demo,后台核心是spring注解实现的(通过jsbcTemplate连接数据库),前台有基本的jsp和easy ui 两种展现方式,数据库使用oracle,可以通过更改配置文件和驱动jar...
这个项目是一个配置简单的 Maven 工程,旨在演示如何将 Swagger UI 结合到 Spring MVC 应用中,以自动生成 API 文档。 首先,Swagger UI 是基于 Swagger 的一个用户界面,它允许通过 UI 直观地浏览和测试 API。...
SpringMVC ---- HelloWorld ---- 代码 SpringMVC ---- HelloWorld ---- 代码 SpringMVC ---- HelloWorld ---- 代码 SpringMVC ---- HelloWorld ---- 代码 SpringMVC ---- HelloWorld ---- 代码 SpringMVC ---- Hello...
【标题】"spring3mvc-jQuery-easyUI做的ajax版本用户管理系统" 提供了一个使用SpringMVC、jQuery和easyUI框架构建的Web应用程序实例,它着重于实现基于Ajax的用户管理功能。这个项目展示了如何将这三个强大的技术...
mybatis-plus-sample-quickstart-springmvc: 快速开始示例(Spring MVC版本) mybatis-plus-sample-reduce-springmvc: 简化掉默认mapper类示例(Spring MVC版本) mybatis-plus-sample-generator: 代码生成器示例 ...
当SpringMVC与jQuery结合,并通过JSON(JavaScript Object Notation)进行数据交换时,可以实现前后端的高效协作,提供更流畅的用户体验。 1. **SpringMVC框架基础**: - **DispatcherServlet**:SpringMVC的核心...
【JavaEE示例-mybatis-spring-springMVC】是一个基于Java的企业级应用程序开发实例,它结合了三个关键的技术框架:MyBatis、Spring和SpringMVC。这个项目旨在展示如何在实际开发环境中有效地整合这三个组件,以实现...
标题中的"springmvc+maven+junit+jqueryUI"是一个典型的Web开发技术组合,涉及四个主要组件:Spring MVC、Maven、JUnit和jQuery UI。现在,让我们深入探讨这些技术及其在实际开发中的应用。 1. Spring MVC(Spring ...
【标题】中的关键词涉及到多个IT领域的核心技术,包括前端框架Bootstrap、JavaScript库jQuery、网页标记语言HTML5,以及后端开发的MVC框架SpringMVC、ORM框架Hibernate和数据访问层框架Mybatis。这些技术在现代Web...
Apache Shiro 和 SpringMVC 的整合示例是一个用于构建安全Web应用的常见实践。这个示例项目不依赖于任何数据库,所有的实现都是基于静态代码,这使得它成为一个快速理解和学习Shiro安全框架的理想起点。 Apache ...
综上所述,Wex5与SpringMVC的结合使得开发者能够利用Wex5的强大UI功能和SpringMVC的灵活控制层来构建高效、可维护的移动Web应用。通过理解和实践这个框架,开发者可以更好地掌握前后端分离的开发模式,提升开发效率...
【UIFramework】是一个示例项目,它结合了【SpringMvc】和【SmartAdmin】两个关键组件,用于构建现代化的Web应用程序界面。这个项目的核心目的是展示如何有效地整合这两者,为开发者提供一个快速开发用户界面的基础...
SwaggerUI结合SpringMVC可以创建一个强大的RESTful API的可视化界面,这使得开发者能够更...总的来说,SwaggerUI与SpringMVC的结合是现代API开发的一个重要实践,它不仅提高了开发效率,也提升了API的质量和用户体验。
SpringMvc和jquery-easyui项目,里边包含easyui的官方例子及中文文档
这个"SpringMVC示例"是展示如何使用SpringMVC来实现基本的后台接口服务。通过理解SpringMVC的工作原理,开发者可以有效地创建可扩展且易于维护的后端系统。 在SpringMVC中,核心组件包括DispatcherServlet、...
本项目"easy ui tree 前后端树形结构项目 权限管理demo"提供了一个完整的解决方案,使用了Easy UI Tree库来实现前端的树形结构,并结合SSM(Spring、SpringMVC、MyBatis)框架和MySQL数据库进行后端处理。...
【标题】"SpringMVC-Mybatis-Shiro-redis-master" 涉及的是一个集成框架项目,这个项目集成了四个关键的技术组件:SpringMVC、MyBatis、Shiro和Redis。这些技术在现代Java Web开发中扮演着重要角色。 **SpringMVC**...
标题 "springmvc与swagger swagger-ui 集成demo" 涉及到的是在Spring MVC框架下集成Swagger和Swagger-UI的技术实践。Spring MVC是Java Web开发中的一个流行框架,用于构建可重用、模块化的Web应用程序。Swagger则是...
基于SpringMVC Mybatis Shiro Redis 的权限管理系统,该系统已经部署到线上,线上访问地址:http://shiro.itboy.net,登录账号:admin 密码:sojson,,详细教程参考sojson.com/shiro
"helloworld------springMVC"项目是一个简单的示例,旨在引导初学者入门SpringMVC的基本概念和配置。让我们深入探讨SpringMVC的核心组件、工作流程以及如何在实际项目中设置和运行这个Hello World程序。 1. **核心...