zoukankan      html  css  js  c++  java
  • 使用Html和ashx文件实现其简单的注册页面

               记得上一次博客中实现的是其登录页面,其实学会了登录页面,注册页面自然就知道怎么写啦,都是一个意思的,但是今天不知道怎么个情况,写一个注册页面程序 中 一直在出错,大的问题小的问题一直出错,似乎是不在状态,但是练习还是要练习的,我并不怕出错,因为现在还是在学习的阶段,问题越多越好吧,但是不希望低 级的错误屡次发生,既浪费自己的时间,也毫无意义;好啦,说太多就不高兴啦,保持好心情,开始我今天的博客之旅。

               一.html页面

    <script src="jquery-1.7.1.min.js"></script>
        <script>
            $(function () {
                $("#name").focus(function () {
                    if ($(this).val() == "请输入用户名") {
                        $(this).val("");
                    }
                }).blur(function () {
                    if ($(this).val() == "") {
                        $(this).val("请输入用户名");
                    }
                })
                $("#pwd").focus(function () {
                    if ($(this).val() == "请输入密码") {
                        $(this).val("");
                        $(this).attr("type", "password");
                    }
                }).blur(function () {
                    if ($(this).val() == "") {
                        $(this).val("请输入密码");
                    }
                })
                $("#address").focus(function () {
                    if ($(this).val() == "请输入地址") {
                        $(this).val("");
                    }
                }).blur(function () {
                    if ($(this).val() == "") {
                        $(this).val("请输入地址");
                    }
                })
    })
    <body>
        <form action="Register.ashx" method="post">
            <table>
                <tr>
                    <td>用户名:</td><td><input type="text" name="txtname" value="请输入用户名" id="name"/></td>
                </tr>
                <tr>
                    <td>密码:</td><td><input type="text" name="txtpwd" value="请输入密码" id="pwd"/></td>
    <!--                <td>密码:</td><td><input type="search" name="pwd" placeholder="请输入密码" /></td>-->
                </tr>
                <tr>
                    <td>地址:</td><td><input type="text" name="txtaddress" value="请输入地址" id="address"/></td>
                </tr>
                <tr>
                    <td>性别:</td><td >男:<input type="radio" name="radio" value="" checked="checked" />女:<input type="radio" name="radio" value="" /></td>
                </tr>
                <tr>
                    <td>邮箱地址:</td><td><input type="email" name="email" value="请输入邮箱地址 " id="email"/></td>
                </tr>
                <tr>
                    <td>出生日期:</td><td><input type="text" name="txtbirthday" value="请输入出生日期" id="birthday"/></td>
                </tr>
                <tr>
                    <td><input type="submit" name="submit" value="注册" /></td><td><input type="button" name="btnlogin" value="登录" /></td>
                </tr>
            </table>
        </form>
    </body>

                       在写上面的的html时间,在文本框中实现了当鼠标点击其文本框则文本框为空,可以填写其值,当文本框值为空时则仍默认为原来的值,但是密码框比较特殊,需 要在我们输入自己设置的密码时间把type=“text”修改为password即可,我想说的是在jquery中我上面是没有实现的,但是使用js是可 以实现,或者使用上面密码框下面注释的使用其属性placeholder可以直接实现其功能,这个是在html5中的新属性。而使用javascript 实现其代码如下:

                document.getElementById("pwd").onfocus = function () {
                    if (this.value == "请输入密码") {
                        this.value = "";
                        this.setAttribute("type","password")
                    }
                }
                document.getElementById("pwd").onblur = function () {
                    if (this.value == "") {
                        this.value = "请输入密码";
                        this.setAttribute("type", "text")
                    }
                }

               二.ashx页面

    public class Register : IHttpHandler {
        PersonBll bll = new PersonBll();
        public void ProcessRequest (HttpContext context) {
            context.Response.ContentType = "text/html";          //文本类型html文档,当为plain时间为读取字符串
            string path = context.Request.MapPath("002.html");      //获取路径
            string html = File.ReadAllText(path);                  //读取文档
            context.Response.Write(html);                     //在这里write与flush还是有区别的
    
            string name = context.Request.Form["txtname"];  //获取用户注册输入的用户名
            string pwd = context.Request.Form["txtpwd"];         //获取密码
            string address = context.Request.Form["txtaddress"];      //获取地址
            bool sex = context.Request.Form["radio"]==""?true:false;    //在这里记得使用bool类型,可以使用三元表达式更加的简单,获取radio的值,性别
            string email = context.Request.Form["email"];           //获取email地址
            string birthday = context.Request.Form["txtbirthday"];    //获取出生日期
            birthday = DateTime.Now.ToString();             //记得在这里给时间类型的值一个初值,否则会在页面报错的
            if (!string.IsNullOrEmpty(name) && !string.IsNullOrEmpty(pwd)) //判断用户名和密码框不为空时间
            {
                PersonModel model=new PersonModel ();     //实例化molde,由于是注册,需要的参数比较多,所以可以传值
                model.Pname = name;     //把用户注册的信息赋值给model
                model.Pwd = pwd;
                model.Paddress = address;
                model.Pgender = sex;
                model.Pemail = email;
                model.Pbirthday = Convert.ToDateTime(birthday);
                if (bll.RegisterSingle(model)>0)     //调用bll层的方法
                {
                    context.Response.Clear();         //清除上面的信息
                    context.Response.Write("欢迎" + model.Pname + "注册成功");  //相应一个注册成功的页面
                }
            }
        }
        public bool IsReusable {
            get {
                return false;
            }
        }
    }

                        很遗憾的说,上面在写sex变量时间,直接定义一个string类型的变量接收了radio的value,后来在这里报错啦,才想起来它是一个bool类型 的值,最好使用三元表达式最简单啦,于是改变的,这里也是以后需要注意的地方;另外就是model的实例化赋值,要实例化赋值之后,才判断调用的bll层 的方法,不可以先调用方法,然后值永远是为null的,感觉写这里的代码就是熟悉的太过熟悉,就没有想,完全是依靠手动的能力,可是意想不到的是在这里出 错啦,写代码还是要好好的用脑的,嘿嘿,

                        另外,就是一个初学者经常犯错的地方,在写时间类型的变量,需要注意的,在这里想详细了解的就来这里(http://www.cnblogs.com/wolf-sun/p/4234884.html),嘿嘿,这就是针对初学这的详细介绍时间类型出错。

               三.三层架构的搭建

    public class PersonBll
        {
            PersonDal dal = new PersonDal();
            public int RegisterSingle(PersonModel model)
            {
                return dal.RegisterSingle(model);
            }
        }
    public class PersonDal
        {
            public int RegisterSingle(PersonModel model)
            {
                string sql = "insert into dbo.Person(Pname, Pwd, Pgender, Paddress,Pemail, Pbirthday) values(@name,@pwd,@sex,@address,@email,@birthday)";
                SqlParameter[] parms= {
                                          new SqlParameter("@name",model.Pname),
                                          new SqlParameter("@pwd",model.Pwd),
                                          new SqlParameter("@sex",model.Pgender),
                                          new SqlParameter("@address",model.Paddress),
                                          new SqlParameter("@email",model.Pemail),
                                          new SqlParameter("@birthday",model.Pbirthday)
                                      };
                return SQLHelper.ExecuteNonQuery(sql,parms);
            }
        }
    public static class SQLHelper
        {
            private static string connection = ConfigurationManager.ConnectionStrings["sql"].ToString();
            public static int ExecuteNonQuery(string sql, params SqlParameter[] parms)
            {
                using (SqlConnection conn = new SqlConnection(connection))
                {
                    conn.Open();
                    using (SqlCommand cmd = new SqlCommand(sql, conn))
                    {
                        cmd.Parameters.AddRange(parms);
                        return cmd.ExecuteNonQuery();
                    }
                }
            }
        }
    public class PersonModel
        {//Id, Pname, Pwd, Pgender, Paddress, Pbirthday
            public int Id { set; get; }
            public string Pname { set; get; }
            public string Pwd { set; get; }
            public bool Pgender { set; get; }
            public string Paddress { set; get; }
            public string Pemail { set; get; }
            public DateTime Pbirthday { set; get; }
        }

                     在搭建三层架构上面这个还没有出错的,感觉只是庆幸吧,不过在这里需要说的是写sql语句时间要注意的,搭建三层时间是最容易出错的地方,嘿嘿。          

                     我们实现的html页面如下所示:

                                

                     好啦,今天就写到这吧,感觉今天是这两个多月来写程序最没有状态的一天,而且还在着急练习,认为写的很熟悉的一段程序只要写出来就要出错,怎么说那,不论怎么样,心情还是要保持好的哦,嘿嘿,好好睡觉起来又是美好的一天啦,要继续努力。

    我是小白,新建立了一个的群:461431726,希望在这里和大家一起交流,共同学习。前端的话建议加群:646564351,谢谢
  • 相关阅读:
    azkaban使用--邮件发送配置
    azkaban使用--schedule定时任务
    azkaban使用--传入动态参数
    GET和POST区别
    微信小程序与java后台交互
    java中的锁分类
    对CAS机制的理解(二)
    对CAS机制的理解(一)
    Spring中Model、ModelMap及ModelAndView之间的区别
    MySQL命令行导入.sql文件遇到的问题
  • 原文地址:https://www.cnblogs.com/dyxd/p/4235203.html
Copyright © 2011-2022 走看看