Unix-2-CRUD-分页+模糊查询-状态更改

最新推荐文章于 2021-05-25 11:07:10 发布

leave417

最新推荐文章于 2021-05-25 11:07:10 发布

阅读量547

点赞数

文章标签： unix crud 带条件模糊查询

本文链接：https://blog.csdn.net/leave417/article/details/78333616

版权

框架:spring+springMVC+myBatis
jar包
jar包
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:jdbc="http://www.springframework.org/schema/jdbc"
     xmlns:jee="http://www.springframework.org/schema/jee"

     xmlns:tx="http://www.springframework.org/schema/tx"
     xmlns:aop="http://www.springframework.org/schema/aop"
     xmlns:mvc="http://www.springframework.org/schema/mvc"
     xmlns:util="http://www.springframework.org/schema/util"
     xmlns:jpa="http://www.springframework.org/schema/data/jpa"
     xsi:schemaLocation="
          http://www.springframework.org/schema/beans http://www.springframework.org/schema/beans/spring-beans-3.2.xsd
          http://www.springframework.org/schema/context http://www.springframework.org/schema/context/spring-context-3.2.xsd
          http://www.springframework.org/schema/jdbc http://www.springframework.org/schema/jdbc/spring-jdbc-3.2.xsd
          http://www.springframework.org/schema/jee http://www.springframework.org/schema/jee/spring-jee-3.2.xsd
          http://www.springframework.org/schema/tx http://www.springframework.org/schema/tx/spring-tx-3.2.xsd
          http://www.springframework.org/schema/data/jpa http://www.springframework.org/schema/data/jpa/spring-jpa-1.3.xsd
          http://www.springframework.org/schema/aop http://www.springframework.org/schema/aop/spring-aop-3.2.xsd
          http://www.springframework.org/schema/mvc http://www.springframework.org/schema/mvc/spring-mvc-3.2.xsd
          http://www.springframework.org/schema/util http://www.springframework.org/schema/util/spring-util-3.2.xsd">
          <!-- 一.整合myBatis:1.2.3 -->
     <!-- 1.导入连接数据库的文件 -->
     <util:properties id="jdbc" location="classpath:jdbc.properties"/>
     <!-- 2.数据库连接池 -->
     <bean id="dataSource" class="org.apache.commons.dbcp.BasicDataSource">
          <!-- 连接数据库四要素 -->
          <property name="url" value="#{jdbc.url}"/>
          <property name="driverClassName" value="#{jdbc.driver}"/>
          <property name="username" value="#{jdbc.user}"/>
          <property name="password" value="#{jdbc.password}"/>
     </bean>
     <!-- 3.配置sqlSessionFactoryBean -->
     <bean id="SqlSessionFactory" class="org.mybatis.spring.SqlSessionFactoryBean">
              <!--3.1引入ds数据源-->
          <property name="dataSource" ref="dataSource"/>
              <!--3.2映射路径:mapperLocations-->
          <property name="mapperLocations" value="classpath:com/lanou3g/entity/*.xml"/>
     </bean>

     <!-- 二.整合Spring:4.5.6
              spring整合其他2大框架:各种组件,同时运行,是一个多线程
     -->
     <!-- 4.加入myBatis注解:MapperScannerConfigurer -->
     <bean class="org.mybatis.spring.mapper.MapperScannerConfigurer">
              <!-- 4.1扫描dao包 -->
          <property name="basePackage" value="com.lanou3g.dao"/>
              <!-- 4.2注解类:包名.注解类名 -->
          <property name="annotationClass" value="com.lanou3g.annotation.MyBatisDao"/>
     </bean>
     <!-- 5.开启注解扫描 -->
     <context:component-scan base-package="com.lanou3g"/>

     <!-- 省略了开启mvc注解,用com.lanou3g.annotation.MyBatisDao.@interface自定义注解 -->

     <!-- 6.开启MVC注解驱动 -->
     <mvc:annotation-driven />

     <!-- 三.整合springMVC:7 -->
     <!-- 7.配置springMVC,处理请求转发,使用"国际资源视图解析器" -->
     <bean id="viewResolver" class="org.springframework.web.servlet.view.InternalResourceViewResolver">
          <property name="prefix" value="/WEB-INF/"/>
          <property name="suffix" value=".jsp"/>
     </bean>

</beans>

jdbc.properties

url=jdbc:oracle:thin:@localhost:1521:orcl
driver=oracle.jdbc.OracleDriver
user=lanou3g
password=lanou3g

实体类
Account.java

package com.lanou3g.entity;

import java.sql.Date;
import java.sql.Timestamp;

public class Account {

    private Integer id;
    private Integer recommender_id;
    private String login_name;
    private String login_passwd;
    private String status;
    private Timestamp create_date;
    private Timestamp pause_date;
    private Timestamp close_date;
    private String real_name;
    private String idcard_no;
    private Date birthdate;
    private String gender;
    private String occupation;
    private String telephone;
    private String email;
    private String mailaddress;
    private String zipcode;
    private String qq;
    private Timestamp last_login_time;
    private String last_login_ip;

    //�Ƽ������֤��
    private String recommender_idcardno;



    @Override
    public String toString() {
        return "Account [id=" + id + ", recommender_id=" + recommender_id
                + ", login_name=" + login_name + ", login_passwd="
                + login_passwd + ", status=" + status + ", create_date="
                + create_date + ", pause_date=" + pause_date + ", close_date="
                + close_date + ", real_name=" + real_name + ", idcard_no="
                + idcard_no + ", birthdate=" + birthdate + ", gender=" + gender
                + ", occupation=" + occupation + ", telephone=" + telephone
                + ", email=" + email + ", mailaddress=" + mailaddress
                + ", zipcode=" + zipcode + ", qq=" + qq + ", last_login_time="
                + last_login_time + ", last_login_ip=" + last_login_ip
                + ", recommender_idcardno=" + recommender_idcardno + "]";
    }

    public String getRecommender_idcardno() {
        return recommender_idcardno;
    }

    public void setRecommender_idcardno(String recommenderIdcardno) {
        recommender_idcardno = recommenderIdcardno;
    }


    public Integer getId() {
        return id;
    }

    public void setId(Integer id) {
        this.id = id;
    }

    public Integer getRecommender_id() {
        return recommender_id;
    }

    public void setRecommender_id(Integer recommender_id) {
        this.recommender_id = recommender_id;
    }

    public String getLogin_name() {
        return login_name;
    }

    public void setLogin_name(String login_name) {
        this.login_name = login_name;
    }

    public String getLogin_passwd() {
        return login_passwd;
    }

    public void setLogin_passwd(String login_passwd) {
        this.login_passwd = login_passwd;
    }

    public String getStatus() {
        return status;
    }

    public void setStatus(String status) {
        this.status = status;
    }

    public Timestamp getCreate_date() {
        return create_date;
    }

    public void setCreate_date(Timestamp create_date) {
        this.create_date = create_date;
    }

    public Timestamp getPause_date() {
        return pause_date;
    }

    public void setPause_date(Timestamp pause_date) {
        this.pause_date = pause_date;
    }

    public Timestamp getClose_date() {
        return close_date;
    }

    public void setClose_date(Timestamp close_date) {
        this.close_date = close_date;
    }

    public String getReal_name() {
        return real_name;
    }

    public void setReal_name(String real_name) {
        this.real_name = real_name;
    }

    public String getIdcard_no() {
        return idcard_no;
    }

    public void setIdcard_no(String idcard_no) {
        this.idcard_no = idcard_no;
    }

    public Date getBirthdate() {
        return birthdate;
    }

    public void setBirthdate(Date birthdate) {
        this.birthdate = birthdate;
    }

    public String getGender() {
        return gender;
    }

    public void setGender(String gender) {
        this.gender = gender;
    }

    public String getOccupation() {
        return occupation;
    }

    public void setOccupation(String occupation) {
        this.occupation = occupation;
    }

    public String getTelephone() {
        return telephone;
    }

    public void setTelephone(String telephone) {
        this.telephone = telephone;
    }

    public String getEmail() {
        return email;
    }

    public void setEmail(String email) {
        this.email = email;
    }

    public String getMailaddress() {
        return mailaddress;
    }

    public void setMailaddress(String mailaddress) {
        this.mailaddress = mailaddress;
    }

    public String getZipcode() {
        return zipcode;
    }

    public void setZipcode(String zipcode) {
        this.zipcode = zipcode;
    }

    public String getQq() {
        return qq;
    }

    public void setQq(String qq) {
        this.qq = qq;
    }

    public Timestamp getLast_login_time() {
        return last_login_time;
    }

    public void setLast_login_time(Timestamp last_login_time) {
        this.last_login_time = last_login_time;
    }

    public String getLast_login_ip() {
        return last_login_ip;
    }

    public void setLast_login_ip(String last_login_ip) {
        this.last_login_ip = last_login_ip;
    }

}

分页
Page.java

package com.lanou3g.util;

public class Page {
     //每页数据量
     private int pageSize=4;

     //当前页码数
     private int  currentPage=1;

     private int begin;
     private int end;
     //数据总行数
     private int rows;
     //总页数
     private int totalPage;



     public Page() {
          super();
          // TODO Auto-generated constructor stub
     }

     public Page(int currentPage,int rows) {
          begin = (currentPage - 1) * pageSize +1;
          end =  currentPage * pageSize;
          totalPage = (rows - 1) / pageSize + 1;
          this.currentPage = currentPage;
          this.rows = rows;
     }

     public int getPageSize() {
          return pageSize;
     }

     public void setPageSize(int pageSize) {
          this.pageSize = pageSize;
     }

     public int getCurrentPage() {
          return currentPage;
     }

     public void setCurrentPage(int currentPage) {
          this.currentPage = currentPage;
     }

     public int getBegin() {
          return (currentPage - 1) * pageSize +1;
     }

     public void setBegin(int begin) {
          this.begin = begin;
     }

     public int getEnd() {
          return currentPage * pageSize;
     }

     public void setEnd(int end) {
          this.end = end;
     }

     public int getRows() {
          return rows;
     }

     public void setRows(int rows) {
          this.rows = rows;
     }

     public int getTotalPage() {
          return (rows - 1) / pageSize + 1;
     }

     public void setTotalPage(int totalPage) {
          this.totalPage = totalPage;
     }



}

实体类映射

AccountMapper.xml
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE mapper
PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
"http://mybatis.org/dtd/mybatis-3-mapper.dtd">
<mapper namespace="com.lanou3g.dao.AccountDao">
     <!-- //查询总个数(模糊查询条件)
     Integer getRows(AccountPage page); -->
     <select id="getRows" parameterType="com.lanou3g.entity.page.AccountPage" resultType="Integer">
          select count(1) from account
          <where>
              <if test="idcard_no != null and idcard_no.length()>0 ">
                   and idcard_no like '%'||#{idcard_no,jdbcType=NUMERIC}||'%'
              </if>
              <if test="real_name != null and real_name.length()>0">
                   and real_name like '%'||#{real_name,jdbcType=VARCHAR}||'%'
              </if>
              <if test="login_name != null and login_name.length()>0">
                   and login_name like '%'||#{login_name,jdbcType=VARCHAR}||'%'
              </if>
              <if test="status != null and status.length()>0">
                   and status = #{status}
              </if>
          </where>
     </select>



     <!-- //根据查询的总个数进行分页(模糊查询条件)
     List<Account> findByPage(AccountPage page); -->
     <select id="findByPage" parameterType="com.lanou3g.entity.page.AccountPage" resultType="com.lanou3g.entity.Account">
          select * from ( select a.*,rownum r from ( select * from account
          <where>
              <if test="idcard_no != null &amp;&amp; idcard_no.length()>0 ">
                   and idcard_no like '%'||#{idcard_no}||'%'
              </if>
              <if test="real_name != null &amp;&amp; real_name.length()>0">
                   and real_name like '%'||#{real_name}||'%'
              </if>
              <if test="login_name != null &amp;&amp; login_name.length()>0">
                   and login_name like '%'||#{login_name}||'%'
              </if>
              <if test="status != null &amp;&amp; !status.equals('-1') ">
                   and status = #{status}
              </if>
          </where>
          order by id ) a )
          where r between #{begin} and #{end}
     </select>

     <insert id="add" parameterType="com.lanou3g.entity.Account">
          insert into account
              (id,REAL_NAME,IDCARD_NO,LOGIN_NAME,
                   LOGIN_PASSWD,TELEPHONE,
              RECOMMENDER_ID,BIRTHDATE,
              EMAIL,OCCUPATION,GENDER,
              MAILADDRESS,ZIPCODE,QQ,STATUS)
              values
               (ACCOUNT_SEQ.nextval,#{real_name},#{idcard_no},#{login_name},
                   #{login_passwd},#{telephone},
               #{recommender_id,jdbcType=NUMERIC},#{birthdate},
               #{email,jdbcType=VARCHAR},#{occupation,jdbcType=VARCHAR},#{gender,jdbcType=VARCHAR},
               #{mailaddress,jdbcType=VARCHAR},#{zipcode,jdbcType=VARCHAR},#{qq,jdbcType=VARCHAR},1
              )
     </insert>

     <update id="updateStatus" parameterType="com.lanou3g.entity.Account">
          update account set status=#{status},
          <choose>
              <when test="status==0">
                   pause_date=null
              </when>
              <when test="status==1">
                   pause_date=SYSDATE
              </when>
              <otherwise>
                   close_date=SYSDATE
              </otherwise>
          </choose>
          where id=#{id}
     </update>

     <update id="delete" parameterType="com.lanou3g.entity.Account">
          update account set status=#{status},close_date=SYSDATE where id=#{id}
     </update>

     <select id="findById" resultType="com.lanou3g.entity.Account">
          select * from account where id=#{id}
     </select>

     <update id="update" parameterType="com.lanou3g.entity.Account">
          update account
          <set>
               real_name=#{real_name},telephone=#{telephone},
              occupation=#{occupation},gender=#{gender},
              <if test="recommender_id != null &amp;&amp; recommender_id.length()>0 ">
                   recommender_id=#{recommender_id},
              </if>
              <if test="email != null &amp;&amp; email.length()>0 ">
                   email=#{email},
              </if>
              <if test="mailaddress != null &amp;&amp; mailaddress.length()>0 ">
                   mailaddress = #{mailaddress},
              </if>
              <if test="zipcode != null &amp;&amp; zipcode.length()>0 ">
                   zipcode = #{zipcode},
              </if>
              <if test="qq != null &amp;&amp; qq.length()>0 ">
                   qq =#{qq},
              </if>
          </set>
          where id=#{id}
     </update>

</mapper>

自定义接口

MyBatisDao.java

package com.lanou3g.annotation;
/**
 *
 * @author lanou3g
 *
 * 开发SpringMVC支持的自定义注解:
 * 1.new接口
 * 2.在接口前+@
 *
 *
 */
public  @interface MyBatisDao {

}

dao层
AccountDao.java

package com.lanou3g.dao;

import java.util.List;

import com.lanou3g.annotation.MyBatisDao;
import com.lanou3g.entity.Account;
import com.lanou3g.entity.page.AccountPage;

@MyBatisDao
public interface AccountDao {

    //查询总个数(模糊查询条件)
    Integer getRows(AccountPage page);

    //根据查询的总个数进行分页(模糊查询条件)
    List<Account> findByPage(AccountPage page);

    //增加
    void add(Account account);

    //更改状态
    void updateStatus(Account account);

    //删除
    void delete(Account account);

    //修改
    void update(Account account);

    //根据id查对象
    Account findById(Integer id);
}

controller层
AccountController.java

package com.lanou3g.dao;

import java.util.List;

import com.lanou3g.annotation.MyBatisDao;
import com.lanou3g.entity.Account;
import com.lanou3g.entity.page.AccountPage;

@MyBatisDao
public interface AccountDao {

    //查询总个数(模糊查询条件)
    Integer getRows(AccountPage page);

    //根据查询的总个数进行分页(模糊查询条件)
    List<Account> findByPage(AccountPage page);

    //增加
    void add(Account account);

    //更改状态
    void updateStatus(Account account);

    //删除
    void delete(Account account);

    //修改
    void update(Account account);

    //根据id查对象
    Account findById(Integer id);
}

JSP页面
显示全部
account_list.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>云科技</title>
        <link type="text/css" rel="stylesheet" media="all" href="${pageContext.request.contextPath }/styles/global.css" />
        <link type="text/css" rel="stylesheet" media="all" href="${pageContext.request.contextPath }/styles/global_color.css" /> 
        <script type="text/javascript" src="${pageContext.request.contextPath }/js/jquery-3.2.1.min.js"></script>
        <script language="javascript" type="text/javascript">
            //删除
            function deleteAccount(id) {
                var r = window.confirm("确定要删除此账务账号吗？\r\n删除后将不能恢复，且会删除其下属的所有业务账号。");
                window.location.href="delete.do?id="+id;
            }
            //开通或暂停
            function setState(num,id) {
                if(num==0){
                    var r = window.confirm("确定要暂停此账务账号吗？");
                    window.location.href="pauseAccount.do?id="+id;
                }
                if(num==1){
                    var r = window.confirm("确定要开通此账务账号吗？");
                    window.location.href="startAccount.do?id="+id;
                }
            }
        </script>
    </head>
    <body>
        <!--Logo区域开始-->
        <div id="header">
            <img src="../images/logo.png" alt="logo" class="left"/>
            <a href="#">[退出]</a>            
        </div>
        <!--Logo区域结束-->
        <!--导航区域开始-->
        <div id="navi">                        
            <ul id="menu">
                <li><a href="../index.html" class="index_off"></a></li>
                <li><a href="../role/role_list.html" class="role_off"></a></li>
                <li><a href="../admin/admin_list.html" class="admin_off"></a></li>
                <li><a href="${pageContext.request.contextPath }/cost/findCost.do" class="fee_off"></a></li>
                <li><a href="${pageContext.request.contextPath }/account/findAccount.do" class="account_on"></a></li>
                <li><a href="../service/service_list.html" class="service_off"></a></li>
                <li><a href="../bill/bill_list.html" class="bill_off"></a></li>
                <li><a href="../report/report_list.html" class="report_off"></a></li>
                <li><a href="../user/user_info.html" class="information_off"></a></li>
                <li><a href="../user/user_modi_pwd.html" class="password_off"></a></li>
            </ul>            
        </div>
        <!--导航区域结束-->
        <!--主要区域开始-->
        <div id="main">
            <form action="${pageContext.request.contextPath }/account/findAccount.do" method="post">
                <!--查询-->
                <div class="search_add"> 
              <!-- 由于带条件的查询,直接点击分页跳转会导致查询条件丢失,所以
        将当前页码数存在表单中,页码直接提交表单document.forms[0].submit();即可
 -->
                <input type="hidden" name="currentPage" value="1" id="currentPage" />  

                    <div>身份证：<input type="text" value="${page.idcard_no}" class="text_search" name="idcard_no" /></div>                            
                    <div>姓名：<input type="text" value="${page.real_name}" class="width70 text_search"  name="real_name" /></div>
                    <div>登录名：<input type="text"  value="${page.login_name}" class="text_search" name="login_name" /></div>
                    <div>
                        状态：
                        <select class="select_search" name="status">
                            <option value="-1">全部</option>
                            <option value="0" <c:if test="${page.status == 0 }">selected</c:if> >开通 </option>
                            <option value="1" <c:if test="${page.status == 1 }">selected</c:if>>暂停</option>
                            <option value="2" <c:if test="${page.status == 2 }">selected</c:if>>删除</option>
                        </select>
                    </div>
                    <div><input type="submit" value="搜索" class="btn_search" /></div>
                    <input type="button" value="增加" class="btn_add" onclick="location.href='${pageContext.request.contextPath }/account/preAdd.do';" />
                </div>  
                <!--删除等的操作提示-->
                <div id="operate_result_info" class="operate_success">
                    <img src="../images/close.png" onclick="this.parentNode.style.display='none';" />
                    删除成功，且已删除其下属的业务账号！
                </div>   
                <!--数据区域：用表格展示数据-->     
                <div id="data">            
                    <table id="datalist">
                    <tr>
                        <th>账号ID</th>
                        <th>姓名</th>
                        <th class="width150">身份证</th>
                        <th>登录名</th>
                        <th>状态</th>
                        <th class="width100">创建日期</th>
                        <th class="width150">上次登录时间</th>                                                        
                        <th class="width200"></th>
                    </tr>
                     <c:forEach items="${accounts}" var="a">
                         <tr>
                            <td>${a.id }</td>
                            <td><a href="account_detail.html">${a.real_name }</a></td>
                            <td>${a.idcard_no }</td>
                            <td>${a.login_name }</td>
                            <c:choose>
                                <c:when test="${a.status == 0}">
                                    <td>开通</td>
                                </c:when>
                                <c:when test="${a.status == 1}">
                                    <td>暂停</td>
                                </c:when>
                                <c:otherwise>
                                    <td>删除</td>
                                </c:otherwise>
                            </c:choose>
                            <td><fmt:formatDate value="${a.create_date}" pattern="yyyy-MM-dd"/></td>
                            <td><fmt:formatDate value="${a.last_login_time}" pattern="yyyy-MM-dd HH:mm:ss"/></td>                            
                            <td class="td_modi">
                                <c:choose>
                                    <c:when test="${a.status == 0}">
                                        <input type="button" value="暂停" class="btn_pause" onclick="setState(${a.status},${a.id });" />
                                        <input type="button" value="修改" class="btn_modify" onclick="location.href='preUpdate.do?id=${a.id}';" />
                                        <input type="button" value="删除" class="btn_delete" onclick="deleteAccount(${a.id});" />
                                    </c:when>
                                    <c:when test="${a.status == 1}">
                                        <input type="button" value="开通" class="btn_start" onclick="setState(${a.status},${a.id });" />
                                        <input type="button" value="修改" class="btn_modify" onclick="location.href='preUpdate.do?id=${a.id}';" />
                                        <input type="button" value="删除" class="btn_delete" onclick="deleteAccount(${a.id});" />
                                    </c:when>
                                </c:choose>
                            </td>
                        </tr>
                    </c:forEach>
                </table>
                <p>业务说明：<br />
                1、创建则开通，记载创建时间；<br />
                2、暂停后，记载暂停时间；<br />
                3、重新开通后，删除暂停时间；<br />
                4、删除后，记载删除时间，标示为删除，不能再开通、修改、删除；<br />
                5、暂停账务账号，同时暂停下属的所有业务账号；<br />                
                6、暂停后重新开通账务账号，并不同时开启下属的所有业务账号，需要在业务账号管理中单独开启；<br />
                7、删除账务账号，同时删除下属的所有业务账号。</p>
                </div>                   
                <!--分页-->
                <div id="pages">
                    <a onclick="showPage(1)" >首页</a>

                    <a <c:if test="${page.currentPage > 1}"> onclick="showPage(${page.currentPage-1})" </c:if>  >上一页</a>

                    <c:forEach begin="1" end="${page.totalPage}" var="i" step="1">
                        <a onclick="showPage(${i})" class="page" >${i}</a>
                    </c:forEach>

                    <a <c:if test="${page.currentPage  != page.totalPage}"> onclick="showPage(${page.currentPage+1})" </c:if> >下一页</a>

                    <a onclick="showPage(${page.totalPage})">末页</a>
                </div>                    
            </form>
        </div>
        <!--主要区域结束-->
        <div id="footer">
            <p>[源自北美的技术，最优秀的师资，最真实的企业环境，最适用的实战项目]</p>
            <p>版权所有(C)云科技有限公司 </p>
        </div>
         <script type="text/javascript">
            $(function(){
                $(".page").eq(${page.currentPage-1}).addClass("current_page").siblings().removeClass("current_page");
            });
            function showPage(currentPage){
                $("#currentPage").val(currentPage);
                document.forms[0].submit();
            }
        </script> 
    </body>
</html>

添加页面
account_add.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title></title>
        <link type="text/css" rel="stylesheet" media="all" href="../styles/global.css" />
        <link type="text/css" rel="stylesheet" media="all" href="../styles/global_color.css" />
        <script language="javascript" type="text/javascript" src="../js/jquery-1.11.1.js"></script>
        <script language="javascript" type="text/javascript">
          //校验身份证
          function check_idcardno(idcardno) {
              //重置生日
              $("#birthdate").val("");

              //如果身份证为空，则给出提示
              if(idcardno == ""){
                   $("#idcardno_msg").text("身份证号不能为空！").addClass("error_msg");
                   return;
              }

              //如果身份证格式不对，则给出提示
              var reg = /^[1-9]\d{5}[1-9]\d{3}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{4}$/;
              if(!reg.test(idcardno)){
                   $("#idcardno_msg").text("身份证号格式不正确！").addClass("error_msg");
                   return;
              }

              //校验通过，给予提示，并移除错误样式
              $("#idcardno_msg").text("有效的身份证号").removeClass("error_msg");

              //根据身份证提取出生日，赋值给生日字段
              var birthdate = idcardno.substring(6,10) + "-" + idcardno.substring(10,12) + "-" + idcardno.substring(12,14);
              $("#birthdate").val(birthdate);
          }
          //查询推荐人ID
          function search_recommender() {
                   //重置recommender_id
              $("#recommender_id").val("");

              //如果身份证为空，则返回
              var idcardno = $("#recommender_idcardno").val();
              if(idcardno == ""){
                   $("#recommender_msg").text("正确的身份证号码格式").removeClass("error_msg");
                   return;
              }

              //如果身份证格式不对，则给出提示
              var reg = /^[1-9]\d{5}[1-9]\d{3}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{4}$/;
              if(!reg.test(idcardno)){
                   $("#recommender_msg").text("身份证号格式不正确！").addClass("error_msg");
                   return;
              }

              //以后用Ajax传值
          }

            //保存成功的提示信息
            function showResult() {
                showResultDiv(true);
                window.setTimeout("showResultDiv(false);", 3000);
            }
            function showResultDiv(flag) {
                var divResult = document.getElementById("save_result_info");
                if (flag)
                    divResult.style.display = "block";
                else
                    divResult.style.display = "none";
            }

            //显示选填的信息项
            function showOptionalInfo(imgObj) {
                var div = document.getElementById("optionalInfo");
                if (div.className == "hide") {
                    div.className = "show";
                    imgObj.src = "../images/hide.png";
                }
                else {
                    div.className = "hide";
                    imgObj.src = "../images/show.png";
                }
            }
        </script>
    </head>
    <body>
        <!--Logo区域开始-->
        <div id="header">
            <img src="../images/logo.png" alt="logo" class="left"/>
            <a href="#">[退出]</a>
        </div>
        <!--Logo区域结束-->
        <!--导航区域开始-->
        <div id="navi">
            <ul id="menu">
                <li><a href="../index.html" class="index_off"></a></li>
                <li><a href="../role/role_list.html" class="role_off"></a></li>
                <li><a href="../admin/admin_list.html" class="admin_off"></a></li>
                <li><a href="${pageContext.request.contextPath }/cost/findCost.do" class="fee_off"></a></li>
                <li><a href="${pageContext.request.contextPath }/account/findAccount.do" class="account_on"></a></li>
                <li><a href="../service/service_list.html" class="service_off"></a></li>
                <li><a href="../bill/bill_list.html" class="bill_off"></a></li>
                <li><a href="../report/report_list.html" class="report_off"></a></li>
                <li><a href="../user/user_info.html" class="information_off"></a></li>
                <li><a href="../user/user_modi_pwd.html" class="password_off"></a></li>
            </ul>

        </div>
        <!--导航区域结束-->
        <!--主要区域开始-->
        <div id="main">
            <!--保存成功或者失败的提示消息-->
            <div id="save_result_info" class="save_fail">保存失败，该身份证已经开通过账务账号！</div>
            <form action="${pageContext.request.contextPath }/account/add.do" method="post" class="main_form">
                <!--必填项-->
                <div class="text_info clearfix"><span>姓名：</span></div>
                <div class="input_info">
                    <input type="text" name="real_name" />
                    <span class="required">*</span>
                    <div class="validate_msg_long">20长度以内的汉字、字母和数字的组合</div>
                </div>
                <div class="text_info clearfix"><span>身份证：</span></div>
                <div class="input_info">
                    <input type="text" name="idcard_no" onblur="check_idcardno(this.value);"/>
                    <span class="required">*</span>
                    <div class="validate_msg_long" id="idcardno_msg">正确的身份证号码格式</div>
                </div>
                <div class="text_info clearfix"><span>登录账号：</span></div>
                <div class="input_info">
                    <input type="text" name="login_name" />
                    <span class="required">*</span>
                    <div class="validate_msg_long">30长度以内的字母、数字和下划线的组合</div>
                </div>
                <div class="text_info clearfix"><span>密码：</span></div>
                <div class="input_info">
                    <input type="password" name="login_passwd" />
                    <span class="required">*</span>
                    <div class="validate_msg_long">30长度以内的字母、数字和下划线的组合</div>
                </div>
                <div class="text_info clearfix"><span>重复密码：</span></div>
                <div class="input_info">
                    <input type="password"  />
                    <span class="required">*</span>
                    <div class="validate_msg_long">两次密码必须相同</div>
                </div>
                <div class="text_info clearfix"><span>电话：</span></div>
                <div class="input_info">
                    <input type="text" class="width200" name="telephone"/>
                    <span class="required">*</span>
                    <div class="validate_msg_medium">正确的电话号码格式：手机或固话</div>
                </div>
                <!--可选项-->
                <div class="text_info clearfix"><span>可选项：</span></div>
                <div class="input_info">
                    <img src="../images/show.png" alt="展开" onclick="showOptionalInfo(this);" />
                </div>
                <div id="optionalInfo" class="hide">
                    <div class="text_info clearfix"><span>推荐人身份证号码：</span></div>
                    <div class="input_info">
                        <input type="text" id="recommender_idcardno" onblur="search_recommender();"/>
                        <input type="hidden" name="recommender_id" id="recommender_id"/>
                        <div class="validate_msg_long" id="recommender_msg">正确的身份证号码格式</div>
                    </div>
                    <div class="text_info clearfix"><span>生日：</span></div>
                    <div class="input_info">
                        <input type="text" name="birthdate" readonly class="readonly" id="birthdate"/>
                    </div>
                    <div class="text_info clearfix"><span>Email：</span></div>
                    <div class="input_info">
                        <input type="text" class="width350" name="email"/>
                        <div class="validate_msg_tiny">50长度以内，合法的 Email 格式</div>
                    </div>

                    <div class="text_info clearfix"><span>职业：</span></div>
                    <div class="input_info">
                        <select name="occupation">
                             <option value="">全部</option>
                            <option value="1">干部</option>
                            <option value="2">学生</option>
                            <option value="3">技术人员</option>
                            <option value="4">其他</option>
                        </select>
                    </div>
                    <div class="text_info clearfix"><span>性别：</span></div>
                    <div class="input_info fee_type">
                        <input type="radio" name="gender" value="1" checked="checked" id="female" />
                        <label for="female">女</label>
                        <input type="radio" name="gender" value="0" id="male" />
                        <label for="male">男</label>
                    </div>

                    <div class="text_info clearfix"><span>通信地址：</span></div>
                    <div class="input_info">
                        <input type="text" class="width350" name="mailaddress"/>
                        <div class="validate_msg_tiny">50长度以内</div>
                    </div>

                    <div class="text_info clearfix"><span>邮编：</span></div>
                    <div class="input_info">
                        <input type="text" name="zipcode"/>
                        <div class="validate_msg_long">6位数字</div>
                    </div>

                    <div class="text_info clearfix"><span>QQ：</span></div>
                    <div class="input_info">
                        <input type="text" name="qq"/>
                        <div class="validate_msg_long">5到13位数字</div>
                    </div>
                </div>
                <!--操作按钮-->
                <div class="button_info clearfix">
                    <input type="submit" value="保存" class="btn_save" />
                    <input type="button" value="取消" class="btn_save" onclick="history.back();"/>
                </div>
            </form>
        </div>
        <!--主要区域结束-->
        <div id="footer">
            <span>[源自北美的技术，最优秀的师资，最真实的企业环境，最适用的实战项目]</span>
            <br />
            <span>版权所有(C)云科技有限公司 </span>
        </div>
    </body>
</html>

更新页面
account_update.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title></title>
        <link type="text/css" rel="stylesheet" media="all" href="../styles/global.css" />
        <link type="text/css" rel="stylesheet" media="all" href="../styles/global_color.css" />
        <script language="javascript" type="text/javascript" src="../js/jquery-1.11.1.js"></script>
        <script language="javascript" type="text/javascript">
          //查询推荐人ID
          function search_recommender() {
                   //重置recommender_id
              $("#recommender_id").val("");

              //如果身份证为空，则返回
              var idcardno = $("#recommender_idcardno").val();
              if(idcardno == ""){
                   $("#recommender_msg").text("正确的身份证号码格式").removeClass("error_msg");
                   return;
              }

              //如果身份证格式不对，则给出提示
              var reg = /^[1-9]\d{5}[1-9]\d{3}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{4}$/;
              if(!reg.test(idcardno)){
                   $("#recommender_msg").text("身份证号格式不正确！").addClass("error_msg");
                   return;
              }
              //用Ajax传递地址和值

          }

            //保存成功的提示信息
            function showResult() {
                showResultDiv(true);
                window.setTimeout("showResultDiv(false);", 3000);
            }
            function showResultDiv(flag) {
                var divResult = document.getElementById("save_result_info");
                if (flag)
                    divResult.style.display = "block";
                else
                    divResult.style.display = "none";
            }

            //显示修改密码的信息项
            function showPwd(chkObj) {
                if (chkObj.checked)
                    document.getElementById("divPwds").style.display = "block";
                else
                    document.getElementById("divPwds").style.display = "none";
            }
        </script>
    </head>
    <body>
        <!--Logo区域开始-->
        <div id="header">
            <img src="../images/logo.png" alt="logo" class="left"/>
            <a href="#">[退出]</a>
        </div>
        <!--Logo区域结束-->
        <!--导航区域开始-->
        <div id="navi">

             <ul id="menu">
                <li><a href="../index.html" class="index_off"></a></li>
                <li><a href="../role/role_list.html" class="role_off"></a></li>
                <li><a href="../admin/admin_list.html" class="admin_off"></a></li>
                <li><a href="../fee/fee_list.html" class="fee_off"></a></li>
                <li><a href="../account/account_list.html" class="account_on"></a></li>
                <li><a href="../service/service_list.html" class="service_off"></a></li>
                <li><a href="../bill/bill_list.html" class="bill_off"></a></li>
                <li><a href="../report/report_list.html" class="report_off"></a></li>
                <li><a href="../user/user_info.html" class="information_off"></a></li>
                <li><a href="../user/user_modi_pwd.html" class="password_off"></a></li>
            </ul>

        </div>
        <!--导航区域结束-->
        <!--主要区域开始-->
        <div id="main">
            <!--保存成功或者失败的提示消息-->
            <div id="save_result_info" class="save_fail">保存失败，旧密码错误！</div>
            <form action="${pageContext.request.contextPath }/account/update.do" method="post" class="main_form">
                    <!--必填项-->
                    <div class="text_info clearfix"><span>账务账号ID：</span></div>
                    <div class="input_info">
                        <input type="text" name="id" value="${account.id}" readonly class="readonly" />
                    </div>
                    <div class="text_info clearfix"><span>姓名：</span></div>
                    <div class="input_info">
                        <input type="text" name="real_name" value="${account.real_name}" />
                        <span class="required">*</span>
                        <div class="validate_msg_long error_msg">20长度以内的汉字、字母和数字的组合</div>
                    </div>
                    <div class="text_info clearfix"><span>身份证：</span></div>
                    <div class="input_info">
                        <input type="text" name="idcard_no" value="${account.idcard_no}" readonly class="readonly" />
                    </div>
                    <div class="text_info clearfix"><span>登录账号：</span></div>
                    <div class="input_info">
                        <input type="text" name="login_name" value="${account.login_name}" readonly class="readonly"  />

                    </div>

                    <div class="text_info clearfix"><span>电话：</span></div>
                    <div class="input_info">
                        <input type="text" name="telephone" class="width200" value="${account.telephone }"/>
                        <span class="required">*</span>
                        <div class="validate_msg_medium error_msg">正确的电话号码格式：手机或固话</div>
                    </div>
                    <div class="text_info clearfix"><span>推荐人身份证号码：</span></div>
                    <div class="input_info">
                        <input type="text" id="recommender_idcardno" onblur="search_recommender();" value="${account.recommender_idcardno}"/>
                        <input type="hidden" name="recommender_id" id="recommender_id" value="${account.recommender_id}"/>
                        <div class="validate_msg_long error_msgs" id="recommender_msg">正确的身份证号码格式</div>
                    </div>
                    <div class="text_info clearfix"><span>生日：</span></div>
                    <div class="input_info">
                        <input type="text" name="birthdate" value="${account.birthdate}" readonly class="readonly" />
                    </div>
                    <div class="text_info clearfix"><span>Email：</span></div>
                    <div class="input_info">
                        <input type="text" name="email" class="width200" value="${account.email }"/>
                        <div class="validate_msg_medium">50长度以内，合法的 Email 格式</div>
                    </div>

                    <div class="text_info clearfix"><span>职业：</span></div>
                    <div class="input_info">
                        <select name="occupation">
                             <option value="">全部</option>
                            <option  value="1" ${account.occupation == '1' ? 'selected' : ''} >干部</option>
                            <option value="2" ${account.occupation=='2' ? 'selected' : ''} >学生</option>
                            <option value="3" ${account.occupation=='3'?'selected':''} >技术人员</option>
                            <option value="4" ${account.occupation=='4'?'selected':''} >其他</option>
                        </select>
                    </div>
                    <div class="text_info clearfix"><span>性别：</span></div>
                    <div class="input_info fee_type">
                        <input type="radio" name="gender" value="1" checked="<c:if test='${account.gender==1}'>checked</c:if>" id="female" onclick="feeTypeChange(1);" />
                        <label for="female">女</label>
                        <input type="radio" name="gender" value="0" checked="<c:if test='${account.gender==0}'>checked</c:if>"  id="male" onclick="feeTypeChange(2);" />
                        <label for="male">男</label>
                    </div>

                    <div class="text_info clearfix"><span>通信地址：</span></div>
                    <div class="input_info">
                        <input type="text" name="mailaddress" class="width350" value="${account.mailaddress }"/>
                        <div class="validate_msg_tiny">50长度以内</div>
                    </div>

                    <div class="text_info clearfix"><span>邮编：</span></div>
                    <div class="input_info">
                        <input type="text" name="zipcode" value="${account.zipcode }"/>
                        <div class="validate_msg_long">6位数字</div>
                    </div>

                    <div class="text_info clearfix"><span>QQ：</span></div>
                    <div class="input_info">
                        <input type="text" name="qq" value="${account.qq }"/>
                        <div class="validate_msg_long">5到13位数字</div>
                    </div>
                    <!--操作按钮-->
                    <div class="button_info clearfix">
                        <input type="submit" value="保存" class="btn_save" />
                        <input type="button" value="取消" class="btn_save" onclick="history.back();"/>
                    </div>
                </form>
        </div>
        <!--主要区域结束-->
        <div id="footer">
            <span>[源自北美的技术，最优秀的师资，最真实的企业环境，最适用的实战项目]</span>
            <br />
            <span>版权所有(C)云科技有限公司 </span>
        </div>
    </body>
</html>

leave417

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
Unix-2-CRUD-分页+模糊查询-状态更改

jar包 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:cont
复制链接

扫一扫