tingyu项目----用ssm和easyui完成登录模块

最新推荐文章于 2020-09-19 18:39:12 发布

Catalina_yep

最新推荐文章于 2020-09-19 18:39:12 发布

阅读量156

点赞数

分类专栏： tingyu项目

本文链接：https://blog.csdn.net/Apple_Andy/article/details/108206694

版权

tingyu项目专栏收录该内容

2 篇文章 0 订阅

订阅专栏

一.效果图

在这里插入图片描述

二.登陆页面实现

1.页面展示

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jstl/core_rt" %>
<head>
    <title>Title</title>
    <%--引入资源--%>
    <%--引入easyUI资源--%>
    <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/static/themes/default/easyui.css">
    <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/static/themes/icon.css">
    <%--一定要先 引入jquery --%>
    <script type="text/javascript" src="${pageContext.request.contextPath}/static/js/jquery.min.js"></script>
    <script type="text/javascript" src="${pageContext.request.contextPath}/static/js/jquery.easyui.min.js"></script>
</head>
<body>
<div style="margin:auto;margin-top: 220px;height: 240px;width: 500px">

    <%--展示错误的提示信息--%>
    <c:if test="${not empty msg}">
        <font size="4" color="red">${msg}</font>
    </c:if>

    <%-- 把session中的 msg属性移除掉--%>
    <c:remove var="msg" scope="session"></c:remove>
    <div id="p" class="easyui-panel" title="ting域后台管理系统"
         style="width:300px;height:220px;padding:10px;background:#fafafa;"
         data-options="iconCls:'icon-save',closable:false,
    collapsible:false,minimizable:false,maximizable:false">

        <%--表单--%>
        <form id="loginForm" action="${pageContext.request.contextPath}/admin/login.do" method="post">
            <div style="text-align: center;margin-top: 20px">
                <label id="aname">用户名:</label>
                <input class="easyui-textbox" type="text" name="aname"/></div>
            <div style="text-align: center;margin-top: 20px"><label id="apwd">密&nbsp;&nbsp;&nbsp;码:</label>
                <input class="easyui-passwordbox" type="text" name="apwd"/></div>
            <div style="text-align: center;margin-top: 20px">
                <a id="btnLogin" href="javascript:void(0)" class="easyui-linkbutton" style="margin-right: 20px"
                   data-options="iconCls:'icon-ok'">登陆</a>

                <input class="easyui-checkbox" data-options="labelPosition:'after'" name="fruit" label="记住密码"
                       style="margin-left: 20px">

            </div>
        </form>
    </div>

</div>


</body>
</html>

2.页面数据的提交

1).给登录按钮添加点击事件,向后台提交数据

用 $("#loginForm").submit()提交

<script>
    /*********登录功能*********/
    $(function () {
    //给登录按钮添加点击事件,向后台提交数据
        $("#btnLogin").click(function () {
            //提交数据
            $("#loginForm").submit();
        })
    })


</script>

3.服务器代码的实现

思路:
1)用方法参数接收页面提交过来的用户名和密码,查询数据库用户名,密码是否正确
用到的service层方法是:getOne(queryWrapper),里面需要传入条件对象

    QueryWrapper<Admin> queryWrapper=new QueryWrapper<>();
    queryWrapper.eq("aname",aname).eq("apwd",apwd);
    Admin admin = adminService.getOne(queryWrapper);

2)如果正确,把用户存到session中,并重定向到主页,不正确,则带着错误转发到登录页面
Controller页面:

@Controller
@RequestMapping("/admin")
public class AdminController {
    @Autowired
    private IAdminService adminService;

    @RequestMapping("login")
    public String login(String aname, String apwd, HttpSession session){
        QueryWrapper<Admin> queryWrapper=new QueryWrapper<>();
        queryWrapper.eq("aname",aname).eq("apwd",apwd);
       
       Admin admin = adminService.getOne(queryWrapper);
        if(admin!=null){
            //成功,保存到session,并跳转到主页
            session.setAttribute("admin",admin);
            return "redirect:/main.jsp";

        }else {
        //失败,则用session保存信息,并转发到登录页面
            session.setAttribute("msg","用户名或者密码有误");
            return "forward:/login.jsp";
        }

    }

}

Catalina_yep

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
tingyu项目----用ssm和easyui完成登录模块

一.效果图二.登陆页面实现1.页面展示<%@ page contentType="text/html;charset=UTF-8" language="java" %><%@ taglib prefix="c" uri="http://java.sun.com/jstl/core_rt" %><head> <title>Title</title> <%--引入资源--%> <%--引入easy
复制链接

扫一扫