常用文件模板

山顶栋人

已于 2022-07-06 20:52:09 修改

阅读量448

点赞数 1

分类专栏： idea 文章标签： web idea

于 2022-07-04 11:16:48 首次发布

本文链接：https://blog.csdn.net/c2974819879/article/details/125596245

版权

idea 专栏收录该内容

3 篇文章 0 订阅

订阅专栏

Mapper.xml：

showUser.xml：

Mapper.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="">

    <sql id="U_USER_COLUMN">
        cgd
        u.id,
        u.user_name,
        u.user_password
    </sql>

    <sql id="U_USER_WHERE">
        <where>
            <if test="null != id">
                u.id = #{id}
            </if>
            <if test="null != userName and '' != userName">
                AND u.user_name = #{userName}
            </if>
            <if test="null != userPassword and '' != userPassword">
                AND u.user_password = #{userPassword}
            </if>
        </where>
    </sql>

    <select id="findUsers" resultType="">
        SELECT
            <include refid=""/>
        FROM
          user_ea u
        <include refid=""/>
    </select>

    <!--
    <update id="updateUser">
        UPDATE
            user_ea
        <trim prefix="SET" suffixOverrides=",">
            <if test="null != userName and '' != userName">
                user_name = #{userName},
            </if>
            <if test="null != userPassword and '' != userPassword">
                user_password = #{userPassword},
            </if>
            <if test="null != rank">
                rank = #{rank},
            </if>
        </trim>
        WHERE
            id = #{id}
    </update>
    -->

    <!--
    <insert id="insertUser">
        INSERT INTO
            user_ea(user_name, user_password)
        VALUES
            (#{userName}, #{userPassword})
    </insert>
    -->

</mapper>

showUser.xml：

<%--
  Created by IntelliJ IDEA.
  User: 小崔
  Date: ${DATE}
  Time: ${TIME}
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<script type="text/javascript" src="<%= request.getContextPath()%>/res/jq/jquery-1.12.4.js"></script>
<script type="text/javascript" src="<%= request.getContextPath()%>/res/layer/layer/layer.js"></script>
<html>
<head>
<meta charset="UTF-8">
<title>展示</title>
    <style type="text/css">
		.topTrStyle{
			font-size: 18px;
			font-weight: 700;
			//color: red;
		}
		.topTdStyle{
			text-align: center;
			height: 23px;
			width: 110px;
			background: #efefef;
		}
		.dataTdStyle{
			text-align: center;
		}
	</style>
</head>
<body>
<%--	<input type="button" value="新增" onclick="addUserFun()">--%>
	<table border="1" cellspacing="0">
		<tr>
			<td class="topTrStyle">ID</td>
			<td class="topTdStyle">密码</td>
			<td class="topTdStyle">爱好</td>
			<td class="topTdStyle" colspan="2">操作</td>
		</tr>
		<tbody id="tb"></tbody>
	</table>
		<div id="upDownButton"></div>

</body>
<script type="text/javascript">
	var resultList = 0;
    var resultListLength = 0;//删除完毕后判断该页是否仅剩一条

	function search(page){
		$.post(
			"<%= request.getContextPath()%>/user/showUser",
			{"page":page},
			function(result){
				if(result.data == null){
					return;
				}
                resultListLength = result.data.userList.length;//删除完毕后判断该页是否仅剩一条
				var html = "";
				var htmlUpDown ="";
				for (var i = 0; i < result.data.userList.length; i++) {
					var user = result.data.userList[i];
					html += "<tr>";
					html += "<td>"+user.userName+"</td>";
					html += "<td>"+user.userPassword+"</td>";
					html += "<td>"+user.userHobbyShow+"</td>";
					html += "<td><input type='button' value='修改' onclick='updateUserFun("+user.id+")'></td>";
					html += "<td><input type='button' value='删除' onclick='deleteUserFun("+user.id+")'></td>";
					html += "</tr>";
				}
				htmlUpDown += "<input type='button' value='上一页' onclick='pageFun(false)'>";
				htmlUpDown += "<input type='button' value='下一页' onclick='pageFun(true,"+result.data.endPage+")'>";
				$("#tb").html(html);
				$("#upDownButton").html(htmlUpDown);
			}
		);
	}

	$(function(){
		var pageNo = 1;
		search(pageNo);
	})


	var pageNo = 1;
	function pageFun(upAndDown,endPage){
		if(upAndDown){
			if(pageNo == endPage){
				layer.msg("后面没有东西啦！");
				return;
			}
			pageNo++;
		}else{
			if(pageNo == 1){
				layer.msg("已经是第一页啦！");
				return;
			}
			pageNo--;
		}
		layer.msg(pageNo);
		search(pageNo);
	}

	<%--function addUserFun(id){--%>
	<%--	layer.open({--%>
	<%--		type: 2,--%>
	<%--		title: '新增',--%>
	<%--		skin: 'layui-layer-lan',--%>
	<%--		shadeClose: true,--%>
	<%--		shade: 0.5,--%>
	<%--		maxmin: true, //开启最大化最小化按钮--%>
	<%--		area: ['30%', '90%'],--%>
	<%--		content: '<%= request.getContextPath()%>/user/toAddUser'--%>
	<%--	});--%>
	<%--}--%>

	<%--function updateUserFun(id){--%>
	<%--	layer.open({--%>
	<%--		type: 2,--%>
	<%--		title: '修改信息',--%>
	<%--		skin: 'layui-layer-lan',--%>
	<%--		shadeClose: true,--%>
	<%--		shade: 0.5,--%>
	<%--		maxmin: true, //开启最大化最小化按钮--%>
	<%--		area: ['30%', '90%'],--%>
	<%--		content: '<%= request.getContextPath()%>/user/toUpdateUser/'+id--%>
	<%--	});--%>
	<%--}--%>

	<%--function deleteUserFun(id) {--%>
	<%--	layer.confirm('确认删除', {--%>
	<%--		title: '删除',--%>
	<%--		shadeClose: true,--%>
	<%--		btn: ['确认','取消'], //按钮--%>
	<%--		skin: 'layui-layer-lan', //样式类名--%>
	<%--		closeBtn: 0,//停用关闭按钮，0为关闭，1、2为不同样式的关闭按钮--%>
	<%--		anim:0//弹出动画--%>
	<%--	}, function(){--%>
	<%--		$.post(--%>
	<%--				"<%= request.getContextPath()%>/user/deleteUser",--%>
	<%--				{"id":id},--%>
	<%--				function(result){--%>
	<%--					if(result.code != '200'){--%>
	<%--						layer.msg(result.msg);--%>
	<%--						return;--%>
	<%--					}--%>
	<%--					layer.msg('删除成功', {icon: 1});--%>
 	<%--                    if(resultListLength == 1) {//用于判断当页面只剩一条数据时，就应该返回展示上一页的内容--%>
	<%--                        search(--pageNo)--%>
	<%--                    }--%>
	<%--					search(pageNo);--%>
	<%--				}--%>
	<%--		);--%>
	<%--	});--%>
	<%--}--%>
</script>
</html>

Validate常用判断：

<script>

    function submitFun(){
        var flag = $("#fm").valid();
        if(!flag){
            return;
        }
    }

    $(function(){
        check();
    })

    function check() {
        jQuery.validator.addMethod(
            "regex", //addMethod第1个参数:方法名称
            function(value,element,params){//addMethod第2个参数:验证方法，参数（被验证元素的值，被验证元素，参数）
                var exp = new RegExp(params);//实例化正则对象，参数为传入的正则表达式
                return exp.test(value);         //测试是否匹配
            },
            "请输入正确的格式"
        );//addMethod第3个参数:默认错误信息

            //regex: "^\\w{0,}@\\w{2,}.(cn|com)$",
        $("#fm").validate({
            rules:{
                userName: {
                    required: true,
                    rangelength: [3,8]
                },
                price: {
                    required: true,
                    number: true
                },
                userPassword: {
                    required: true,
                    rangelength: [3,8]
                },
                userCheckPassword: {
                    required: true,
                    rangelength: [3,8],
                    equalTo: "#userPassword"
                },
                sex: "required",
                hobby: {
                    required: true,
                    minlength: 2
                },
                userClass: "required",
                phone: {
                    required: true,
                    regex: "^1[358794]\\d{9}$",
                },
                email: {
                    required: true,
                    regex: "[\\w!#$%&'*+/=?^_`{|}~-]+(?:\\.[\\w!#$%&'*+/=?^_`{|}~-]+)*@(?:[\\w](?:[\\w-]*[\\w])?\\.)+[\\w](?:[\\w-]*[\\w])?",
                    email: true
                },
                date: "required",
                file: "required"
            },
            messages:{
                userName: {
                    required: "请输入用户名",
                    rangelength: "输入长度必须介于 3 和 8 之间的字符串（汉字算一个字符）"
                },
                price: {
                    required: "金额为必填项",
                    number: "您输入的数字不合法"
                },
                userPassword: {
                    required: "请输入密码",
                    rangelength: "输入长度必须介于 3 和 8 之间"
                },
                userCheckPassword: {
                    required: "请确认密码",
                    rangelength: "输入长度必须介于 3 和 8 之间",
                    equalTo: "两个密码不一致"
                },
                sex: "性别为必选项",
                hobby: {
                    required: "爱好为必选项",
                    minlength: "请至少选择两项"
                },
                userClass: "班级为必选项",
                phone: {
                    required: "手机号为必填项",
                    regex: "手机号格式有误"
                },
                email: {
                    required: "邮箱为必填项",
                    regex: "请输入一个正确的邮箱"
                },
                date: "日期为必选项",
                file: "头像为必填项",
                // errorPlacement 是给自己定义的错误提示位置
                errorPlacement: function(error, element) {
                    if (element.is(":checkbox")||element.is(":radio")){
                        error.appendTo(element.parent());
                    }else {
                        error.insertAfter(element);
                    }
                }
            }
        });
    }

</script>
<style>
    .error{
        color:red;
    }
</style>