struts2+spring+mybatis datagrid增删改查以及分页的实现

经过这几天的努力，终于把所有的功能都实现了。借鉴了大神们的太多，感谢你们。

那我就慢慢贴出我的代码。

一：easyUi 和struts2+spring+mybatis 环境搭建

二：基本配置

1.web.xml

<?xml version="1.0" encoding="UTF-8"?><web-app version="3.0" xmlns="http://java.sun.com/xml/ns/javaee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_3_0.xsd">  <display-name></display-name>  <context-param><param-name>contextConfigLocation</param-name><param-value>classpath:applicationContext.xml</param-value></context-param><!-- spring监听器，加载xml文件 --><listener><listener-class>org.springframework.web.context.ContextLoaderListener</listener-class></listener><!-- struts 前端控制器 --><filter>        <filter-name>struts2</filter-name>        <filter-class>org.apache.struts2.dispatcher.ng.filter.StrutsPrepareAndExecuteFilter</filter-class>    </filter>    <filter-mapping>        <filter-name>struts2</filter-name>        <url-pattern>/*</url-pattern>    </filter-mapping></web-app>

2.applicationContext.xml

<?xml version="1.0" encoding="UTF-8"?><beans xmlns="http://www.springframework.org/schema/beans"       xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"       xmlns:context="http://www.springframework.org/schema/context"       xmlns:aop="http://www.springframework.org/schema/aop"       xmlns:tx="http://www.springframework.org/schema/tx"       xsi:schemaLocation="http://www.springframework.org/schema/beans           http://www.springframework.org/schema/beans/spring-beans.xsd          http://www.springframework.org/schema/context           http://www.springframework.org/schema/context/spring-context.xsd          http://www.springframework.org/schema/aop           http://www.springframework.org/schema/aop/spring-aop.xsd          http://www.springframework.org/schema/tx           http://www.springframework.org/schema/tx/spring-tx.xsd">    <!--     数据源     <bean id="dataSource" class="org.springframework.jdbc.datasource.DriverManagerDataSource">        <property name="driverClassName" value="oracle.jdbc.driver.OracleDriver"></property>        <property name="url" value="jdbc:oracle:thin:@localhost:1521:orcl"></property>        <property name="username" value="vsplat_demo"></property>        <property name="password" value="root"></property>    </bean>  -->   <context:property-placeholder location="classpath:c3p0.properties"/>        <bean id="dataSource" class="com.mchange.v2.c3p0.ComboPooledDataSource"><property name="driverClass" value="${C3p0_class}"></property><property name="jdbcUrl" value="${C3p0_url}"></property><property name="user" value="${C3p0_username}"></property><property name="password" value="${C3p0_password}"></property></bean>             <bean id="sessionFactory" class="org.mybatis.spring.SqlSessionFactoryBean">        <property name="configLocation" value="classpath:sqlMapConfig.xml"></property>        <property name="dataSource" ref="dataSource"></property>    </bean>        <!-- 事务相关控制 -->    <bean name="transactionManager"        class="org.springframework.jdbc.datasource.DataSourceTransactionManager">        <property name="dataSource" ref="dataSource"/>    </bean>    <!-- 通知 -->    <tx:advice id="tx"        transaction-manager="transactionManager">        <tx:attributes>            <tx:method name="delete*" propagation="REQUIRED" />            <tx:method name="insert*" propagation="REQUIRED" />            <tx:method name="update*" propagation="REQUIRED" />            <tx:method name="find*" read-only="true" />            <tx:method name="get*" read-only="true" />            <tx:method name="select*" read-only="true" />        </tx:attributes>    </tx:advice>    <aop:config>        <aop:pointcut id="pc" expression="execution(* com.test.service.*.*(..))" />        <!--把事务控制在Service层-->        <aop:advisor pointcut-ref="pc" advice-ref="tx" />    </aop:config>        <bean id="IJobDao" class="com.test.daoImpl.JobDaoImpl">        <property name="sqlSessionFactory" ref="sessionFactory"></property>    </bean>        <bean id="jobService" class="com.test.serviceImpl.JobServiceImpl">        <property name="iJobDao" ref="IJobDao"></property>    </bean>       <bean id="jobAction" class="com.test.action.JobAction" scope="prototype">        <property name="jobService" ref="jobService">        </property>    </bean></beans>

3.sqlMapConfig.xml

<?xml version="1.0" encoding="UTF-8"?><!DOCTYPE configurationPUBLIC "-//mybatis.org//DTD Config 3.0//EN""http://mybatis.org/dtd/mybatis-3-config.dtd"><configuration>       <typeAliases>        <typeAlias type="com.test.entity.JobModel" alias="jobModel"></typeAlias>    </typeAliases>    <mappers>        <mapper resource="com/test/serviceImpl/JobMapper.xml"/>    </mappers></configuration>

4.JobMapper.xml

<?xml version="1.0" encoding="UTF-8"?><!DOCTYPE mapperPUBLIC "-//mybatis.org//DTD Mapper 3.0//EN""http://mybatis.org/dtd/mybatis-3-mapper.dtd"><mapper namespace="com.test.entity.JobModel">    <sql id="cols">        id,name,job_name,salary,start_date    </sql>    <sql id="ucols">        name=#{name},job_name=#{job_name},salary=#{salary},start_date=#{start_date}    </sql>    <!-- 查询所有记录 -->    <select id="listAll" resultType="com.test.entity.JobModel">        select <include refid="cols"/> from test_job    </select>        <!-- 按条件查询 -->    <select id="find" parameterType="com.test.entity.JobModel" resultType="com.test.entity.JobModel">        select * from test_job         <where>        <if test="name!=null">            and name like "%"#{name}"%"        </if>        </where>    </select>        <!-- 查询一个用户 -->    <select id="get" parameterType="string" resultType="com.test.entity.JobModel">        select <include refid="cols"/> from test_job where id=#{id}    </select>        <!-- 新增 -->    <insert id="add" parameterType="com.test.entity.JobModel">        insert into test_job (id,name,job_name,salary,start_date) values(#{id},#{name},#{job_name},#{salary},#{start_date})    </insert>        <!-- 修改 -->    <update id="update" parameterType="com.test.entity.JobModel">        update test_job set  <include refid="ucols"/>        where id=#{id}    </update>        <!-- 删除 -->    <delete id="delete" parameterType="string">        delete from test_job where id=#{id}    </delete>    <!-- 分页查询显示所有 --><select id="findAllPage" resultType="com.test.entity.JobModel" parameterType="Integer">select * from test_job order by go asc limit #{page},#{rows};</select><!-- 按部门查询 --><select id="getByJobName" resultType="com.test.entity.JobModel" parameterType="string">select * from test_job where job_name=#{job_name}</select></mapper>

5.struts.xml

<?xml version="1.0" encoding="UTF-8" ?><!DOCTYPE struts PUBLIC    "-//Apache Software Foundation//DTD Struts Configuration 2.0//EN"   "http://struts.apache.org/dtds/struts-2.0.dtd"><struts>  <constant name="struts.ui.theme" value="simple"></constant>     <constant name="struts.devMode" value="true"></constant>     <constant name="struts.objectFactory" value="spring"></constant>         <package name="jobModel" namespace="/" extends="json-default">        <action name="jobAction_*" class="com.test.action.JobAction" method="{1}">                             <result type="json" name="plist"><param name="root">result</param>></result>   <result type="json" name="list">  <param name="root">result2</param>></result>          </action>     </package></struts>

6.实体类

package com.test.entity;public class JobModel {private String id;private String name;private String job_name;private String salary;private String start_date;private int go ;public int getGo() {return go;}public void setGo(int go) {this.go = go;}public JobModel() {// TODO Auto-generated constructor stub}public String getId() {return id;}public void setId(String id) {this.id = id;}public String getName() {return name;}public void setName(String name) {this.name = name;}public String getJob_name() {return job_name;}public void setJob_name(String job_name) {this.job_name = job_name;}public String getSalary() {return salary;}public void setSalary(String salary) {this.salary = salary;}public String getStart_date() {return start_date;}public void setStart_date(String start_date) {this.start_date = start_date;}}

我增加了一个go字段，排序用。(之前表设置太随意，只好再加上个字段)

7.dao实现类

package com.test.daoImpl;import java.util.List;import org.mybatis.spring.support.SqlSessionDaoSupport;import com.test.dao.IJobDao;import com.test.entity.JobModel;import com.test.utils.Pager;public class JobDaoImpl extends SqlSessionDaoSupport implements IJobDao{@Overridepublic List<JobModel> list() {return this.getSqlSession().selectList("com.test.entity.JobModel.listAll");}@Overridepublic JobModel get(String id) {// TODO Auto-generated method stubreturn (JobModel) this.getSqlSession().selectOne("com.test.entity.JobModel.get",id);}@Overridepublic int insert(JobModel u) {// TODO Auto-generated method stubreturn this.getSqlSession().insert("com.test.entity.JobModel.add",u);}@Overridepublic int update(JobModel u) {// TODO Auto-generated method stubreturn this.getSqlSession().update("com.test.entity.JobModel.update",u);}@Overridepublic int deleteById(String id) {// TODO Auto-generated method stubreturn this.getSqlSession().delete("com.test.entity.JobModel.delete",id);}@Overridepublic List<JobModel> getTeacherList(int page, int rows) {// TODO Auto-generated method stubPager pager = new Pager();pager.setPage(page);pager.setRows(rows);return this.getSqlSession().selectList("com.test.entity.JobModel.findAllPage", pager);}@Overridepublic List<JobModel> getListByCondition(String condition) {// TODO Auto-generated method stubreturn this.getSqlSession().selectList("com.test.entity.JobModel.getByJobName",condition);}}

8.service实现类：

package com.test.serviceImpl;import java.util.List;import com.test.dao.IJobDao;import com.test.entity.JobModel;import com.test.service.JobService;public class JobServiceImpl implements JobService {    private IJobDao iJobDao;        public IJobDao getiJobDao() {return iJobDao;}public void setiJobDao(IJobDao iJobDao) {this.iJobDao = iJobDao;}    public int deleteById(String id) {        int i = iJobDao.deleteById(id);        return i;    }    public JobModel get(String id) {        return iJobDao.get(id);    }    public int insert(JobModel u) {        return iJobDao.insert(u);    }    public List<JobModel> list() {        return iJobDao.list();    }    public int update(JobModel u) {        return iJobDao.update(u);    }    @SuppressWarnings("unchecked")public List<JobModel> listWithPage(int page,int rows) {        return iJobDao.getTeacherList(page, rows);    }@Overridepublic List<JobModel> getByJob(String jobName) {// TODO Auto-generated method stubreturn iJobDao.getListByCondition(jobName);}}

9.action类

package com.test.action;import java.util.HashMap;import java.util.List;import java.util.Map;import com.opensymphony.xwork2.ActionContext;import com.opensymphony.xwork2.ActionSupport;import com.opensymphony.xwork2.ModelDriven;import com.test.entity.JobModel;import com.test.service.JobService;public class JobAction extends ActionSupport implements ModelDriven<JobModel> {    private JobModel model = new JobModel();    private Map<String, Object> result = new HashMap<String, Object>(); // result变量用于传送Json变量的返回值      private Map<String, Object> result2 = new HashMap<String, Object>();     private String page;private String rows;private String queryWord;private String queryType;public String getQueryWord() {return queryWord;}public void setQueryWord(String queryWord) {this.queryWord = queryWord;}public String getQueryType() {return queryType;}public void setQueryType(String queryType) {this.queryType = queryType;}public Map<String, Object> getResult2() {return result2;}public void setResult2(Map<String, Object> result2) {this.result2 = result2;}public Map<String, Object> getResult() {return result;}public void setResult(Map<String, Object> result) {this.result = result;}public String getPage() {return page;}public void setPage(String page) {this.page = page;}public String getRows() {return rows;}public void setRows(String rows) {this.rows = rows;}public JobModel getModel() {        return model;    }    private JobService jobService;    public JobService getJobService() {return jobService;}public void setJobService(JobService jobService) {this.jobService = jobService;}public void setModel(JobModel model) {this.model = model;}public String listByJob(){List<JobModel> dataList = jobService.getByJob(queryWord) ;result2.put("total", dataList.size());//total键 存放总记录数，必须的  result2.put("rows", dataList);//rows键 存放每页记录 list   return "list" ;}public String list(){  int pages = Integer.parseInt(page) ;int rowss = Integer.parseInt(rows) ;        List<JobModel> pageList = jobService.listWithPage((pages-1)*rowss ,rowss ) ;        List<JobModel> dataList = jobService.list() ;        result.put("total", dataList.size());//total键 存放总记录数，必须的          result.put("rows", pageList);//rows键 存放每页记录 list           System.out.println("---------------"+pageList.size());        System.out.println("page"+page);        System.out.println("rows"+rows);        return "plist";    }        public String createSave(){           jobService.insert(model);        return null;    }        public String updateSave(){        jobService.update(model);                return null;    }        public String delete(){        jobService.deleteById(model.getId());               return null;    }}

10.easuUi.jsp

<%@ page language="java"  pageEncoding="utf-8"%><%@ taglib prefix="s"  uri="/struts-tags"%><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html> <head>  <title>easyUi</title> <!-- 引入JQuery -->  <script type="text/javascript" src="${pageContext.request.contextPath}/easyui-1.4.1/jquery.min.js"></script><!-- 引入EasyUI --><script type="text/javascript" src="${pageContext.request.contextPath}/easyui-1.4.1/jquery.easyui.min.js"></script> <!-- 引入EasyUI的中文国际化js，让EasyUI支持中文 --> <script type="text/javascript" src="${pageContext.request.contextPath}/easyui-1.4.1/locale/easyui-lang-zh_CN.js"></script>    <script type="text/javascript" src="${pageContext.request.contextPath}/js/table.js"></script>    <script type="text/javascript" src="${pageContext.request.contextPath}/js/index.js"></script>    <!-- 引入EasyUI的样式文件-->   <link rel="stylesheet" href="${pageContext.request.contextPath}/easyui-1.4.1/themes/default/easyui.css" type="text/css"/>  <!-- 引入EasyUI的图标样式文件--> <link rel="stylesheet" href="${pageContext.request.contextPath}/easyui-1.4.1/themes/icon.css" type="text/css"/>  <link rel="stylesheet" href="${pageContext.request.contextPath}/easyui-1.4.1/themes/icon.css" type="text/css"/> <script type="text/javascript">  //根据职位查询 function reloadgrid ()  {         //查询参数直接添加在url中               var url =$('#dg').datagrid('options').url;      var queryWord = $('#userAccount').val() ;             url = "jobAction_listByJob.action" ;  //重新赋值url 属性        $('#dg').datagrid('options').url=url;         //查询参数直接添加在queryParams中            var queryParams = $('#dg').datagrid('options').queryParams;                 var queryType = "job_name" ;         queryParams.queryWord = queryWord;   queryParams.queryType = queryType;          $('#dg').datagrid('options').queryParams=queryParams;                    //前段分页 function pagerFilter(data){            if (typeof data.length == 'number' && typeof data.splice == 'function'){    // 判断数据是否是数组                data = {                    total: data.length,                    rows: data                }            }            var dg = $(this);            var opts = dg.datagrid('options');            var pager = dg.datagrid('getPager');            pager.pagination({                onSelectPage:function(pageNum, pageSize){                    opts.pageNumber = pageNum;                    opts.pageSize = pageSize;                    pager.pagination('refresh',{                        pageNumber:pageNum,                        pageSize:pageSize                    });                    dg.datagrid('loadData',data);                }            });            if (!data.originalRows){                data.originalRows = (data.rows);            }            var start = (opts.pageNumber-1)*parseInt(opts.pageSize);            var end = start + parseInt(opts.pageSize);            data.rows = (data.originalRows.slice(start, end));            return data;        }         $(function(){//加载数据            $('#dg').datagrid({loadFilter:pagerFilter}).datagrid('loadData', getData());        });         }   function list(){        $('#dg').datagrid('options').url="jobAction_list" ;    $('#dg').datagrid('reload'); }   //打开添加窗口   function addUser(){     $('#dlg').dialog('open').dialog('setTitle','添加用户');     $('#fm').form('clear');   }   //添加用户   function saveUser(){      $.messager.progress();//显示一个进度条      $('#fm').form('submit',{      url:'jobAction_createSave.action',      onsubmit:function(){        var isValid=$(this).form('validate');        if(!isValid){          $.messager.progress('close');//当form不合法时隐藏工具条        }        return isValid;//返回false，将停止提交      },      success:function(data){        $.messager.progress('close');//成功提交，隐藏进度条        $('#dlg').dialog('close');        $('#dg').datagrid('reload');        $.messager.show({          title:'操作提示',          msg:"添加成功！",          timeout:5000,          showType:'slide'        });      }      });   }   //删除用户      function delUser(){     var rows=$('#dg').datagrid('getSelected');     if(rows){       $.messager.confirm('Confirm','确定删除选中行数据？',function(r){         if(r){           $.post('jobAction_delete.action?id='+rows.id,function(data){             $('#dg').datagrid('reload');             $.messager.show({               title:'操作提示',               msg:"删除成功！",               timeout:5000,               showType:'slide'             });           });         }       });     }else{      $.messager.show({        title:'操作提示',        msg:"请选择要删除的行。。。",        timeout:5000,        showType:'slide'      });     }   }     //打开编辑 并回显数据   function updUser(){        var rows = $('#dg').datagrid('getSelected');      if(rows){      $('#update').dialog('open').dialog('setTitle','更新用户');      $('#update-fm').form('clear');      $('#id').val(rows.id);   $('#name').val(rows.name);   $('#job_name').val(rows.job_name);   $('#salary').val(rows.salary);   $('#start_date').val(rows.start_date);      }else{    $.messager.show({    title:'操作提示',    msg:'请选择一行数据进行修改。。。',    timeout:5000,    showType:'slide'    });   }   }      //执行编辑操作   function updUser2(){ var row =$('#dg').datagrid('getSelected');  $.messager.progress();// 显示一个进度条 $('#update-fm').form('submit', {url: 'jobAction_updateSave.action',onSubmit: function(){var isValid = $(this).form('validate');if (!isValid){$.messager.progress('close');// 当form不合法的时候隐藏工具条}return isValid;// 返回false将停止form提交 },success: function(data){$.messager.progress('close');// 当成功提交之后隐藏进度条$("#update").dialog("close");$("#dg").datagrid("reload");$.messager.show({title:'操作提示',msg:"修改成功",timeout:5000,showType:'slide'});}});}</script>  </head>  <body>           <table id="dg" ></table>        <body> <!-- 添加用户 -->     <div id="dlg" class="easyui-dialog" style="width:300px;height:200px;padding:20px 20px"closed="true" buttons="#add-buttons">       <form id="fm" method="post">         <div class="fitem">           <label> I  D：</label>           <input type="text" name="id" class="easyui-validatebox" required="true"/>         </div>           <div class="fitem">           <label>姓名：</label>           <input type="text" name="name" class="easyui-validatebox" required="true"/>         </div>           <div class="fitem">           <label>职位：</label>           <input type="text" name="job_name" class="easyui-validatebox" required="true"/>         </div>         <div class="fitem">           <label>薪资：</label>           <input type="text" name="salary" class="easyui-validatebox" required="true"/>         </div>         <div class="fitem">           <label>时间：</label>           <input type="text" name="start_date" class="easyui-validatebox" required="true"/>         </div>       </form>     </div>          <div id="add-buttons">       <a href="#" class="easyui-linkbutton" iconCls="icon-ok" onclick="saveUser()">添加</a>       <a href="#" class="easyui-linkbutton" iconCls="icon-cancel" onclick="javascript:$('#dlg').dialog('close')">取消</a>     </div>     <div id="update" class="easyui-dialog" style="width:320px;height:320px;padding:10px 20px"     closed="true" buttons="#update-buttons">       <form id="update-fm" method="post">         <input type="hidden" name="id" id="id" /><br/>                               姓名：<input type="text" name="name" id="name"    class="easyui-validatebox"/><br/>        职位：<input type="text" name="job_name" id="job_name"   class="easyui-validatebox"/><br/>         薪资：<input type="text" name="salary" id="salary" class="easyui-validatebox" /><br/>         时间  ：<input type="text" name="start_date" id="start_date" class="easyui-validatebox" /><br/>       </form>       <div id="#update-buttons">       <a href="#" class="easyui-linkbutton" iconCls="icon-ok" onclick="updUser2()">修改</a>       <a href="#" class="easyui-linkbutton" iconCls="icon-cancel" onclick="javascript:$('#dlg').dialog('close')">取消</a>     </div>       </div>             </body>       </html>

11.引入的table.js

$(function() {datagrid = $("#dg").datagrid({url : 'jobAction_list',// 加载的URLisField : "id",width : 600,rownumbers: true,pagination : true,// 显示分页pageSize : 5,// 分页大小pageList : [ 5, 10, 15, 20 ],// 每页的个数checkbox:true,selectOnCheck: true,checkOnSelect: true,fitColumns : false,iconCls : "icon-save",// 图标title : "教师管理", sortOrder: "asc",         sortName: "Id",   columns : [ [ // 每个列具体内容{field : 'id',title : '工号',width : 100,}, {field : 'name',title : '姓名',width : 100}, {field : 'job_name',title : '职位',width : 100}, {field : 'salary',title : '薪资',width : 100,}, {field : 'start_date',title : '入职时间',width : 100,}, ] ],toolbar : [ // 工具条    {        text: '职位<input type="text" id="userAccount"/>'    },    {    test:'<select type="text" id="selectCondition"/>'    },    {    text : "查询",    iconCls : "icon-search",    handler : function() {// 回调函数     var queryWord = $('#userAccount').val() ;     if(queryWord == "" ){     list() ;     }else{     reloadgrid( ) ;     }              }  },{text : "增加",iconCls : "icon-add",handler : function() {// 回调函数$('#wass').window('open') ;addUser();}}, {text : "删除",iconCls : "icon-remove",handler : function() {//alert('add');var row = $('#dg').datagrid('getSelected');delUser();}}, {text : "修改",iconCls : "icon-edit",handler : function() {updUser();}}, ]});});

三：结果展示：

1.主界面(含分页)

2.增加

3.删除

4.修改

5.查询(含分页)


四：总结

自认为代码写的比较乱，望需求人慢慢研究，有什么不足欢迎指正，下面我会再写一篇里面的具功能实现的介绍，比如分页，查询，数据回显等。