SpringMVC+easyUI 分页，查询 （完整的CRUD）

终于完成CRUD的功能了，注意，这里会对前面有一些改动，UserController的listUser() 已经改写了，现在把全部整理一下吧。

JSP：

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!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">
	<base href="<%=basePath%>">
	<meta name="description" content="easyui help you build your web page easily!">
	<title>jQuery EasyUI CRUD Demo</title>
		<link rel="stylesheet" type="text/css" href="css/easyui/themes/default/easyui.css">
	<link rel="stylesheet" type="text/css" href="css/easyui/themes/icon.css">
	<link rel="stylesheet" type="text/css" href="css/easyui/demo.css">
	<script type="text/javascript" src="js/jquery-easyui-1.4.2/jquery.min.js"></script>
	<script type="text/javascript" src="js/jquery-easyui-1.4.2/jquery.easyui.min.js"></script>
	<style type="text/css">
		#fm{
			margin:0;
			padding:10px 30px;
		}
		.ftitle{
			font-size:14px;
			font-weight:bold;
			color:#666;
			padding:5px 0;
			margin-bottom:10px;
			border-bottom:1px solid #ccc;
		}
		.fitem{
			margin-bottom:5px;
		}
		.fitem label{
			display:inline-block;
			width:80px;
		}
	</style>
	<script type="text/javascript">
		var url;
		function newUser(){
			$('#dlg').dialog('open').dialog('setTitle','新建用户');
			$('#fm').form('clear');
			url = 'user/addUser';
		}
		function editUser(){
			var row = $('#dg').datagrid('getSelected');
			// alert(row.userId);

			if (row){
				$('#dlg').dialog('open').dialog('setTitle','编辑用户');
				$('#fm').form('load',row);
				//url = 'user/updateUser?id='+row.userId;
				url ='user/updateUser';
			}
		}
		function saveUser(){
			$('#fm').form('submit',{
				//url:'user/addUser',
				url: url,
				onSubmit: function(){
					return $(this).form('validate');
				},
				success: function(result){
					var result = eval('('+result+')');
					if (result.success){
						$.messager.show({
						title:'Info',
						msg:result.msg,
						showType:'fade',
						style:{
							right:'',
							bottom:''
							}
						});
						$('#dlg').dialog('close');		// close the dialog
						$('#dg').datagrid('reload');	// reload the user data
					} else {
						$.messager.show({
							title: 'Error',
							msg: result.msg
						});
					}
				}
			});
		}
		function removeUser(){
			var row = $('#dg').datagrid('getSelected');
			 //alert(row.id);
			if (row){
				$.messager.confirm('Confirm','你确定要删除用户吗?',function(r){
					if (r){
						$.post('user/removeUser',{id:row.userId},function(result){
							if (result.success){
								$.messager.show({
						title:'Info',
						msg:result.msg,
						showType:'fade',
						style:{
							right:'',
							bottom:''
							}
						});
								$('#dg').datagrid('reload');	// reload the user data
							} else {
								$.messager.show({	// show error message
									title: 'Error',
									msg: result.msg
								});
							}
						},'json');
					}
				});
			}
		}
		function doSearch(){
			$('#dg').datagrid('load',{
			queryUserId: $('#userId').val()
		});
}

	</script>
</head>
<body>
	<h2>Basic CRUD Application</h2>
	<div class="demo-info" style="margin-bottom:10px">
		<div class="demo-tip icon-tip"> </div>
		<div>Click the buttons on datagrid toolbar to do crud actions.</div>
	</div>

	<table id="dg" title="My Users" class="easyui-datagrid" style="width:700px;height:250px"
			url="user/listUsers"
			toolbar="#toolbar" pagination="true"
			rownumbers="true" fitColumns="true" singleSelect="true">
		<thead>
			<tr>
				<th field="userId" width="50">UserId</th>
				<th field="userName" width="50">UserName</th>
				<th field=passWord width="50">PassWord</th>
				<th field="enable" width="50">Enable</th>
			</tr>
		</thead>
	</table>
	<div id="toolbar">
		<a href="javascript:void(0);" class="easyui-linkbutton" iconCls="icon-add" plain="true" onclick="newUser()">New User</a>
		<a href="javascript:void(0);" class="easyui-linkbutton" iconCls="icon-edit" plain="true" onclick="editUser()">Edit User</a>
		<a href="javascript:void(0);" class="easyui-linkbutton" iconCls="icon-remove" plain="true" onclick="removeUser()">Remove User</a>
		<div>
			<span>User ID:</span>
			<input id="userId" style="line-height:26px;border:1px solid #ccc">
			<a href="javascript:void(0);" class="easyui-linkbutton" plain="true" onclick="doSearch()">Search</a>
		</div>
	</div>

	<div id="dlg" class="easyui-dialog" style="width:400px;height:280px;padding:10px 20px"
			closed="true" buttons="#dlg-buttons">
		<div class="ftitle">User Information</div>
		<form id="fm" method="post" novalidate>
			<div class="fitem">
				<label>UserId:</label>
				<input name="userId" class="easyui-validatebox" required="true">
			</div>
			<div class="fitem">
				<label>UserName:</label>
				<input name="userName" class="easyui-validatebox" required="true">
			</div>
			<div class="fitem">
				<label>PassWord:</label>
				<input name="passWord">
			</div>
			<div class="fitem">
				<label>Enable:</label>
				<input name="enable" class="easyui-validatebox" >
			</div>
		</form>
	</div>
	<div id="dlg-buttons">
		<a href="javascript:void(0);" class="easyui-linkbutton" iconCls="icon-ok" onclick="saveUser()">Save</a>
		<a href="javascript:void(0);" class="easyui-linkbutton" iconCls="icon-cancel" onclick="javascript:$('#dlg').dialog('close')">Cancel</a>
	</div>
</body>
</html>

Controller：

package com.yang.bishe.controller;

import java.util.HashMap;
import java.util.List;
import java.util.Map;

import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.ServletRequestUtils;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.servlet.ModelAndView;

import com.yang.bishe.entity.Grid;
import com.yang.bishe.entity.Json;
import com.yang.bishe.entity.User;
import com.yang.bishe.service.interfaces.IUserService;

@Controller
@RequestMapping("/user")
public class UserController extends BaseController {
	@Autowired
	private IUserService userService;
	@RequestMapping("/list")
	   public ModelAndView goList(){
		  return new ModelAndView("user/list");
	    }
	@RequestMapping("/listUsers")
	  public String listUser(HttpServletRequest request,
				HttpServletResponse response) throws Exception {
		page=ServletRequestUtils.getIntParameter(request, "page", 1);//默认值为1
		rows=ServletRequestUtils.getIntParameter(request, "rows", 0);
		String queryUserId=request.getParameter("queryUserId");//获取要查询的用户账号
		Grid grid = new Grid();
		String hql;
		List<User>users;
		if(queryUserId!=null)
		{
			hql="from User as user where user.UserId like  '%"+queryUserId+"%'";
		}else{
			hql="from User";
		}
		users=(List<User>)userService.find(hql, page, rows);
		grid.setTotal(userService.count("select count(*) from User"));
		grid.setRows(users);
		writeJson(grid,response);
		return null;
	    }

	@RequestMapping("/addUser")
	 public String addUser(User user,HttpServletRequest request,
				HttpServletResponse response) throws Exception{
		Json json = new Json();//用于向前端发送消息
		if(userService.getById(user.getUserId())!=null){
			json.setMsg("新建用户失败，用户已存在！");
		}else{
			userService.save(user);
			json.setMsg("新建用户成功！");
			json.setSuccess(true);
		}
		writeJson(json,response);
		return null;
		}
	@RequestMapping("/removeUser")
	 public String removeUser(HttpServletRequest request,HttpServletResponse response) throws Exception{
		Json json = new Json();//用于向前端发送消息
		String userId=request.getParameter("id");
		try{
			userService.delete((User)userService.getById(userId));//不懂为啥要加上（User）才对。。
			json.setMsg("删除成功！");
			json.setSuccess(true);
			writeJson(json,response);
			return null;
		}catch (Exception e){
			json.setMsg("删除失败！"+e.getMessage());
			writeJson(json,response);
			return null;
		}

		}
	@RequestMapping("/updateUser")
	 public String updateUser(User user,HttpServletResponse response) throws Exception{
		Json json = new Json();//用于向前端发送消息
		try{
				userService.update(user);
				json.setMsg("更新成功！");
				json.setSuccess(true);
				writeJson(json,response);
				return null;
		}catch(Exception e){
			json.setMsg("更新失败！"+e.getMessage());
			writeJson(json,response);
			return null;
		}

	}
}

其实listUser里面一逻辑可以放到service上的，还没弄。。。

service层没什么，是继承一个baseService

package com.yang.bishe.service.impl;

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;

import com.yang.bishe.dao.IBaseDao;
import com.yang.bishe.entity.User;
import com.yang.bishe.service.base.BaseServiceImpl;
import com.yang.bishe.service.interfaces.IUserService;
@Service
public class UserServiceImpl extends BaseServiceImpl<User> implements IUserService {
	@Autowired
	private IBaseDao<User> userDao;
}

userDao都是继承BaseDao的：我就贴一些用到的函数吧（接口啥的就不贴出来了）：

package com.yang.bishe.dao;

import java.io.Serializable;
import java.math.BigInteger;
import java.util.List;
import java.util.Map;

import org.hibernate.Query;
import org.hibernate.SQLQuery;
import org.hibernate.Session;
import org.hibernate.SessionFactory;
import org.hibernate.transform.Transformers;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Repository;

@Repository
public class BaseDaoImpl<T>implements IBaseDao<T> {

	@Autowired
	private SessionFactory sessionFactory;

	/**
	 * 获得当前事物的session
	 *
	 * @return org.hibernate.Session
	 */
	public Session getCurrentSession() {
		return sessionFactory.getCurrentSession();
	}

	@Override
	public Serializable save(T o) {
		if (o != null) {
			return getCurrentSession().save(o);
		}
		return null;
	}

	@SuppressWarnings("unchecked")
	@Override
	public T getById(Class<T> c, Serializable id) {
		return (T) getCurrentSession().get(c, id);
	}

	@Override
	public T getByHql(String hql) {
		Query q = getCurrentSession().createQuery(hql);
		List<T> l = q.list();
		if (l != null && l.size() > 0) {
			return l.get(0);
		}
		return null;
	}

	@Override
	public void delete(T o) {
		if (o != null) {
			getCurrentSession().delete(o);
		}
	}

	@Override
	public void update(T o) {
		if (o != null) {
			getCurrentSession().update(o);
		}
	}

	@Override
	public List<T> find(String hql) {
		Query q = getCurrentSession().createQuery(hql);
		return q.list();
	}

	@Override
	public List<T> find(String hql, int page, int rows) {
		Query q = getCurrentSession().createQuery(hql);
		return q.setFirstResult((page - 1) * rows).setMaxResults(rows).list();
	}

	@Override
	public Long count(String hql) {
//		Query q = getCurrentSession().createQuery(hql).;
//		return (Long) q.uniqueResult();
		return  (Long)getCurrentSession().createQuery(hql).list().get(0);
	}

	@Override
	public int executeHql(String hql) {
		Query q = getCurrentSession().createQuery(hql);
		return q.executeUpdate();
	}

	@SuppressWarnings("unchecked")
	@Override
	public List<Map> findBySql(String sql) {
		SQLQuery q = getCurrentSession().createSQLQuery(sql);
		return q.setResultTransformer(Transformers.ALIAS_TO_ENTITY_MAP).list();
	}

	@Override
	public List<Map> findBySql(String sql, int page, int rows) {
		SQLQuery q = getCurrentSession().createSQLQuery(sql);
		return q.setFirstResult((page - 1) * rows).setMaxResults(rows).setResultTransformer(Transformers.ALIAS_TO_ENTITY_MAP).list();
	}

	@Override
	public int executeSql(String sql) {
		SQLQuery q = getCurrentSession().createSQLQuery(sql);
		return q.executeUpdate();
	}

	@Override
	public BigInteger countBySql(String sql) {
		SQLQuery q = getCurrentSession().createSQLQuery(sql);
		return (BigInteger) q.uniqueResult();
	}

}

效果图：

第二页：

根据userId查找，这里是模糊查询：

编辑用户（弹出的对话框会获取选中的数据）：

修改后：

时间： 2024-10-15 21:07:17

SpringMVC+easyUI 分页，查询 （完整的CRUD）的相关文章

Mybatis+SpringMVC实现分页查询（附源码）

Maven+Mybatis+Spring+SpringMVC实现分页查询(附源码) 一.项目搭建 关于项目搭建,小宝鸽以前写过一篇Spirng+SpringMVC+Maven+Mybatis+MySQL项目搭建,这篇文章提供了详细的搭建过程,而且提供了源码下载,接下来的将在这个源码的基础上继续开发.所以建议各位猿友可以把猿友下载一下. 二.分页插件的介绍 博主采用的插件是PageHelper这个插件,使用起来十分方便.该插件支持以下数据库: Oracle Mysql MariaDB SQLite

springMVC+ajax分页查询

项目用到ajax技术的查询,查询结果很多时候要分页展示.这两天摸索了一下,在这里做一总结,方便自己随时查看, 也方便后人参考. 这里的顺序遵从从前台页面到后台控制器,业务层,Dao层,Mapper 下面先讲页面,页面js代码如下: <span style="font-size:14px;">/* 全局变量 */ var userCount;//符合查找条件的用户总页数,分页参考 var pageIndex = 0;//当前页,默认为0 var pageSize = 8;//

SpringMVC Servlet 分页查询接收参数

@RequestMapping("/sendHistory") public ModelAndView sendrhistory(HttpServletRequest req, HttpServletResponse rep, @RequestParam int p) throws Exception { System.out.println("start..."); String a=req.getParameter("status"); Mo

springmvc+mybatis+easyui分页

道德三黄五帝,功名夏侯商周.五霸七雄闹春秋,顷刻兴亡过手.清时几行名姓,北芒无数荒丘.前人播种后人收,说什么原创与否. 今天和大家分享一下springmvc+mybatis+easyui的分页实现.springmvc,mybatis的优缺点不做太多敖述大家都比较了解了,ssm框架整合的例子网上也有很多了,为什么还要写这篇文章那,主要是觉得大多过于零散配置方式又是千差万别,总结一下本文希望对遇到此问题的人有所帮助,前人播种后人收.当然程序开发没有觉得正确,谁也说不出一个正确的实现第N行代码是什么,

SpringMVC+easyUI中datagrid分页实现_2014.5.1

一.概述 SpringMVC: 1.是面对方法级变量的,在操作起来会比struts方便一些(structs是类级变量),具体体现在了srpingMVC的注解上面, 如@RequstMapping("/login"),而且对于返回值ModelAndView这也是一大亮点,既可以返回一个页面(View),再加上@ResponseBody注解以后就可以返回一个      模型对象(也就是一种数据结构). 2.对于方法级传入的参数操作起来也相当方便,比如本例中,在加载DataGrid时,会像后

easyui将查询参数绑定到分页控件

一 在进行条件查询(带分页)时,有时候会出现一种情况:根据查询条件查找得到第一页数据,当你点击下一页后,不会携带查询条件进行分页. 解决方案: 获取查询条件   var data=$('#search').serializeJson(); 将查询条件绑定到分页控件上 var queryParams = $('#datagrid_id').datagrid('options').queryParams;//获取查询参数,接下来就是设置进去 for (var temp in data) {     

一个共通的viewModel搞定所有的分页查询一览及数据导出（easyui + knockoutjs + mvc4.0)

前言 大家看标题就明白了我想写什么了,在做企业信息化系统中可能大家写的最多的一种页面就是查询页面了.其实每个查询页面,除了条件不太一样,数据不太一样,其它的其实都差不多.所以我就想提取一些共通的东西出来,再写查询时只要引入我共通的东西,再加上极少的代码就能完成.我个人比较崇尚代码简洁干净,有不合理的地方欢迎大家指出. 这篇文章主要介绍两个重点:1.前台viewModel的实现.2.后台服务端如何简洁的处理查询请求. 需求分析 查询页面要有哪些功能呢 1.有条件部输入查询条件(这个不打算做成共通的

（easyui datagrid+mvc+json）之asp.net分页查询

最近在做分页查询的功能,在网上也翻看了不少,但是自己的吸收能力就差了好多,而且当时最大的想法就是,怎么就没有我想要的那种,既是easyui的,又要用mvc的架构,还要能够实现底层的分页传值,用.net平台写的demo,那时就想,等我做出来了,我也要写一篇分页查询的博客,专门为了实现这种需求来做的demo. 效果图 前台view <table id="list_data" class="easyui-datagrid" style="width:107

Mybatis + SpringMVC + Maven实现分页查询

使用Mybatis + Maven + SpringMVC 运行时,突然被需要分页查询的功能给难住了 这里推荐采用的插件是PageHelper这个插件,使用起来十分方便.该插件支持以下数据库: Oracle Mysql MariaDB SQLite Hsqldb PostgreSQL DB2 SqlServer(2005+) Informix H2 对应于github的项目地址: https://github.com/pagehelper/Mybatis-PageHelper 关于使用建议猿友们