登录页面的代码

登录页面的代码开发工具与关键技术:MVC/JavaScript作者:邱慧敏撰写时间:2019/06/25在把页面和数据库做好之后,我的登录页面只需要用户名和密码,所以代码比较简单。先找到登录按钮,给一个点击事件,然后再获取他们的表单值,然后对用户名和密码进行判断,判断是否填写了资料和是否是正确的账户和密码,在这之前还要检查登录页面是否是属于外层页面。dataValidationFo…

大家好,又见面了,我是你们的朋友全栈君。

登录页面的代码

在把页面和数据库做好之后,我的登录页面只需要 用户名和密码 ,所以代码比较简单。
先找到登录按钮,给一个点击事件,然后再获取他们的表单值,然后对用户名和密码进行判断,判断是否填写了资料和是否是正确的账户和密码,在这之前还要检查登录页面是否是属于外层页面。dataValidationForm 是from表单的ID,用户名和密码必须要加上value

<input type="text" name="UserNuber" id="UserNuber" class="form-control" placeholder="用户名" value="@ViewBag.UserNuber" style="width:93%;" />
 <input type="Password" name="Password" id="Password" class="form-control" placeholder="密码" value="@ViewBag.Password" style="width:93%;" />
<script>
 var layer;
   $(function () {
       //键盘按下事件
       window.onkeydown = onreturn;
         //用于检查登录页面是否是外层页面
         if (window.top.location.href != window.location.href) {
             window.top.location.href = window.location.href;
            }
         //加载&初始化layui模块,弹出层模块
         layui.use(['layer'], function (args) {
             layer = layui.layer;
         });
        $("#btnSubmit").click(function () {
          //获取值
          var UserNuber = $('#dataValidationForm [name="UserNuber"]').val();//用户名
          var Password = $('#dataValidationForm [name="Password"]').val();//密码
var rememberMe = $('#dataValidationForm[name="rememberMe"]:checked').val();//是否记住密码
            //判断是否填写数据 判断用户名和密码
            if (strValIsNotNull(UserNuber) && strValIsNotNull(Password)) {
                var layerIndex = layer.load();//打开加载层
                $.post("/WCommerce/UserLogin",//路径:控制器名称+控制器中的方法名称
                  {
                     UserNuber: UserNuber,//用户名
                     Password: Password,//密码
                     rememberMe: rememberMe,//是否记住密码
                   }, function (msg) {
                     layer.close(layerIndex);//加载层
                   if (msg == "success") {
                       //alert("登录成功");
                       //跳转到主页面
                window.location.replace("/WCommerce/Main");//跳转路径:控制器名称+主页面
                } else {
                    if (msg == "PasswordErro") {
                        layer.alert('请输入正确的账号或密码');
                      }
                     else if (msg == "userNoExsit") {
                         layer.alert('用户不存在');
                      }
                      else {
                         layer.alert('登录失败');
                      }
                       //清空密码
                       $("#Password").val("");
                            }
                        });
                } else {
                    alert("请填写完整数据");
                }
            });
            //字符串值不为空
            function strValIsNotNull(strVal) {
                return strVal != undefined && strVal != null && strVal != '';
            }
    </script>

然后在后台里获取cookie,

public ActionResult Login()
{
   string UserNuber = "";
   string Password = "";    
   bool isRember = false;
   //获取cookie
  HttpCookie cookie = System.Web.HttpContext.Current.Request.Cookies["user"];
    if (cookie != null)
      {
       if (cookie["UserNuber"] != null)
        {
      UserNuber = System.Web.HttpContext.Current.Server.UrlDecode(cookie["UserNuber"]);
            }
            if (cookie["Password"] != null)
             {
      Password = System.Web.HttpContext.Current.Server.UrlDecode(cookie["Password"]);
              }
              isRember = true;
            }
            ViewBag.UserNuber = UserNuber;
            ViewBag.Password = Password;
            ViewBag.isRember = isRember;
            return View();
        }

接下来就是最关键的后台代码了,获取页面传递的变量,然后用linq的查询方法,根据账号查询出一条用户数据…

 public ActionResult UserLogin(PW_User pwUser)
{
   string strMsg = "fail";//定义一个记录状态的变量
   //获取页面传递的变量
   string strUserNuber = pwUser.UserNuber;   //用户名
   string strPassword = pwUser.Password;     //密码
   string strIsRember = Request["rememberMe"];    //记住否        
   //验证码正确
    try
     {
      //根据账号查询出一条用户数据
      //linq
       PW_User dbUser = (from tbUser in myModels.PW_User
                         where tbUser.UserNuber == strUserNuber && tbUser.ToVoidNo == true
                         select tbUser).Single();//结果只能有一条数据,0条或者大于等于2条都会出现异常(一般单表查询时用)
       //对用户输入的密码加密
       string password = Common.AESEncryptHelper.Encrypt(strPassword);
       //用加密后的密码和数据库查询到的密码比较
       if (password == dbUser.Password)
        {
          //=验证选择的角色是否正确
          var listUserType = (from tbUser in myModels.PW_User
                              join tbUserRoleDetail in myModels.PW_UserRoleDetail on tbUser.UserID equals tbUserRoleDetail.UserID
                              join tbUserType in myModels.SYS_UserType on tbUserRoleDetail.UserTypeID equals tbUserType.UserTypeID
                              where tbUser.UserID == dbUser.UserID
                              select new
                              {
                                 tbUserType.UserTypeID,
                                 tbUserType.UserType
                               }).ToList();
           if (listUserType.Count > 0)
             {
                //=确认身份正确
//把用户数据放到session中
                //获取用户类型名称
                string userTypeName = listUserType[0].UserType.Trim();
                //获取用户类型ID
                int userTypeId = listUserType[0].UserTypeID;
                //设置session
                Session["UserID"] = dbUser.UserID;//传递UserID
                Session["UserTypeID"] = userTypeId;//传递UserTypeID
                Session["ServerTime"] = DateTime.Now.ToString("yyy-MM-dd HH:mm:ss");//登录时间
                //记住用户信息 使用cookie
                if (strIsRember != null && strIsRember.Trim() == "true")
                   {
                     //记住
                     //记住密码 保存cookie
                     HttpCookie cookie = new HttpCookie("user");
                     cookie.Expires = DateTime.Now.AddDays(7);//保存7天
                     cookie["UserNuber"] = strUserNuber;//用户名
                     cookie["Password"] = strPassword;//密码
                     Response.Cookies.Add(cookie);
         }
         else
             {
                //忘记
                HttpCookie cookie = new HttpCookie("user");
                cookie.Expires = DateTime.Now.AddDays(-1);//有效期设置为昨天,浏览器会自动删除cookie
                Response.Cookies.Add(cookie);
               }
                 strMsg = "success";//登录成功
                 }
                  else
                      {
                        strMsg = "userTypeErro";//用户类型错误
                        }
                    }
                    else
                    {
                        strMsg = "passwordErro";//密码错误
                    }
                }
                catch (Exception e)
                {
                    strMsg = "userNoExsit";//没有此用户
                    Console.Write(e);
                    //throw;
                }
            return Json(strMsg, JsonRequestBehavior.AllowGet);
        }

完整代码就是这样的了,如果还需要其他的判断条件可自行添加上去。效果图:
在这里插入图片描述
如果需要按回车键登录的话,

//按下回车键实现登录效果
 function onreturn() {
  if (window.event.keyCode == 13) {
     $("#btnSubmit").click();
         }
     }
版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

发布者:全栈程序员-用户IM,转载请注明出处:https://javaforall.cn/125056.html原文链接:https://javaforall.cn

【正版授权,激活自己账号】: Jetbrains全家桶Ide使用,1年售后保障,每天仅需1毛

【官方授权 正版激活】: 官方授权 正版激活 支持Jetbrains家族下所有IDE 使用个人JB账号...

(0)


相关推荐

  • 解决Execution failed for task ‘:app:checkDebugDuplicateClasses‘.

    解决Execution failed for task ‘:app:checkDebugDuplicateClasses‘.

  • 小米路由器3 opkg安装

    小米路由器3 opkg安装小米路由器3opkg安装1、复制opkg到小米路由的/data路径下。下载地址:http://sangbo.pub/soft/opkg/opkg2、修改/etc/opkg.conf文件,替换为以下内容:src/gzattitude_adjustment_basehttp://openwrt.sangbo.pub/barrier_breaker/14.07/ramips/mt7620a/

  • object.finalize_object的equals方法

    object.finalize_object的equals方法Object类九大方法之finalize方法finalize()是Object的protected方法,子类可以覆盖该方法以实现资源清理工作,GC在回收对象之前调用该方法。finalize的作用(1)finalize()与C++中的析构函数不是对应的。C++中的析构函数调用的时机是确定的(对象离开作用域或delete掉),但Java中的finalize的调用具有不确定性(2)不建议用fin…

  • 关于Python缩进,我们该了解哪些?

    关于Python缩进,我们该了解哪些?Python是一门独特的语言,它的代码块是通过缩进(Indentation)来标记的(大部分语言都是使用花括号作为代码块的标记),具有相同缩进的多行代码属于同一个代码块。如果代码莫名其妙的乱缩进,Py

  • 用html编写或在dw中完成,Dreamweaver教程-在 Dreamweaver 中编写 HTML 代码[通俗易懂]

    用html编写或在dw中完成,Dreamweaver教程-在 Dreamweaver 中编写 HTML 代码[通俗易懂]Dreamweaver教程-在Dreamweaver中编写HTML代码,代码,教程,标签,光标,文本Dreamweaver教程-在Dreamweaver中编写HTML代码易采站长站,站长之家为您整理了Dreamweaver教程-在Dreamweaver中编写HTML代码的相关内容。1.启动DreamweaverCS52.点击左上角的“文件”>“新建”。3.在“新…

  • 【获奖公布】“我的2016”主题征文活动

    【获奖公布】“我的2016”主题征文活动还记得2015的年末,2016的新年伊始,你给自己定下的目标,对自己许下的诺言么?时光荏苒,一年又在指缝间溜走了,离2016的结束还剩十多天,在接下来的这十几天里,让我们用博客记录下这或开心、或痛苦,或特殊,或平淡的2016年,愿剩下的每一天我们都不会虚度~值此岁末之际,CSDN博客频道携手“图灵教育”开展了“我的2016”主题征文活动,听大家聊聊2016年的工作、生活中的点滴感动、喜悦和收获,

发表回复

您的电子邮箱地址不会被公开。

关注全栈程序员社区公众号