1. 程式人生 > >BS(三層)增刪改查——一般處理程式(ashx)版本

BS(三層)增刪改查——一般處理程式(ashx)版本

    今天我們學習一下ASP.Net 的增刪改查,這個和以往的CS增刪改查最大的區別就是U層。以往我們學CS的時候都是用的winform窗體,我們可以直接在窗體中新增控制元件。然後針對控制元件的事件屬性進行一系列的操作。到了BS,U層變成了空白的瀏覽器介面,不能直接的拖拉控制元件,一切都很隨意,如果對前端知識瞭解少的話,真的是很難下手。

  在稍微瞭解BS之後,我們先來看一篇短短的部落格web網站與Web應用程式

  以下的增刪改查我們用的是一般處理程式(ashx)

查:(select)

   第一步: 一個HTML的靜態頁面設計瀏覽器的框架,好比一個winform窗體,裡面上設計好我們需要的控制元件。

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title></title>
    <script src="JS/jquery-3.3.1.min.js"></script>
    <script type="text/javascript">
        $(function () {
            $(".deletes").click(function () {
                if (!confirm("確定要刪除麼")) {
                    return false;
                }
            });
        });
    </script>
</head>
<body>
    <a href="AddUserInfo.html">新增</a>
    <table border="1">
        <tr>
            <th>編號</th>
            <th>使用者名稱</th>
            <th>密碼</th>
            <th>郵箱</th>
            <th>時間</th>
            <th>刪除</th>
            <th>詳細</th>
            <th>編輯</th>
        </tr>
        @tbody
    </table>
</body>
</html>

第二步:一個載入使用者資訊的動態頁面,也就是C#程式碼介面

 public class HanderUserInfo : IHttpHandler
    {
        /// <summary>
        /// 獲取資料庫中所有使用者的資訊
        /// </summary>
        /// <param name="context"></param>
        public void ProcessRequest(HttpContext context)
        {  //輸出內容型別為Html
            context.Response.ContentType = "text/html";
            userInfoBLL bll = new userInfoBLL();
            //接收返回來的資料
            List<userInfo> list = bll.GetList();
            StringBuilder sb = new StringBuilder();
            //遍歷實體資訊
            foreach (userInfo user in list)
            {
                sb.AppendFormat("<tr><td>{0}</td><td>{1}</td><td>{2}</td><td>{3}</td><td>{4}</td><td><a href='DeleteUser.ashx?id={0}'class='deletes'>刪除</a></td><td><a href='ShowDetial.ashx?uid={0}'>詳細</a></td><td><a href='EditUserInfo.ashx?id={0}'>編輯</a></td></tr>", user.Id,user.userName,user.userPass,user.Email,user.regTime);
            }
            //獲取模板路徑
            string filepath = context.Request.MapPath("userInfoHtml.html");
            //讀取模板檔案內容,並給其賦值
            string fileContent = File.ReadAllText(filepath);
            fileContent = fileContent.Replace("@tbody", sb.ToString());
            //輸出給瀏覽器
            context.Response.Write(fileContent);           
        }

        public bool IsReusable
        {
            get
            {
                return false;
            }
        }
    }

獲取部分使用者資訊

第一步:一個單個使用者資訊的Html介面

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title></title>
</head>
<body>
    <table border="1">
        <tr>
            <td>使用者名稱</td>
            <td>$name</td>
        </tr>
        <tr>
            <td>密碼</td>
            <td>$pwd</td>
        </tr>
    </table>
</body>
</html>

第二步:從資料庫中獲取使用者資訊,載入到HTML介面

public class ShowDetial : IHttpHandler
    {

        public void ProcessRequest(HttpContext context)
        {
            context.Response.ContentType = "text/html";
            int id;
            if (int.TryParse(context.Request.QueryString["uid"], out id))
            {
                userInfoBLL Bll = new userInfoBLL();
                userInfo user = Bll.GetUserInfo(id);
                if (user!=null)
                {                   
                    //獲取模板路徑
                    string filepath = context.Request.MapPath("ShowDetial.html");
                    //讀取模板檔案內容,並給其賦值
                    string fileContent = File.ReadAllText(filepath);
                    fileContent = fileContent.Replace("$name", user.userName).Replace("$pwd",user.userPass);
                    //輸出給瀏覽器
                    context.Response.Write(fileContent);
                }
                else
                {
                    context.Response.Redirect("Error.html");
                }
            }
            else
            {
                context.Response.Write("引數錯誤");
            }
        }

        public bool IsReusable
        {
            get
            {
                return false;
            }
        }
    }

增 (新增使用者資訊)(insert)

  第一步新增一個靜態的新增使用者的Html介面

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>新增使用者</title>
</head>
<body>
    <!--表單就是用來收集使用者資料的,method就是表單的提交方式,action為所指的動態頁面-->
    <form method="post" action="AddUserInfo.ashx">
        使用者名稱:<input type="text" name="txtName"><br />
        密碼:<input type="password" name="txtPwd"><br />
        郵箱:<input type="text" name="txtMail"><br />
        <input type="submit" value="新增" />
    </form>
</body>
</html>

第二步:提交使用者資訊

 public class AddUserInfo : IHttpHandler
    {

        public void ProcessRequest(HttpContext context)
        {
            context.Response.ContentType = "text/plain";
            //接收使用者輸入的資料
            string username = context.Request.Form["txtName"];
            string userPwd = context.Request.Form["txtPwd"];
            string userMail = context.Request.Form["txtMail"];
            //將資料新增到實體
            userInfo user = new userInfo()
            {
                userName = username,
                userPass = userPwd,
                Email = userMail,
                regTime = DateTime.Now,
            };
            userInfoBLL bll = new userInfoBLL();
            if (bll.AddUserInfo(user))
            {   //新增成功後返回到handerUserinfo.ashx介面,重新載入資料庫資料
                context.Response.Redirect("HanderUserInfo.ashx");
            }
            else
            {   //跳轉到出錯介面
                context.Response.Redirect("Error.html");
            }
        }

        public bool IsReusable
        {
            get
            {
                return false;
            }
        }
    }

 刪(delete)直接在載入使用者介面進行刪除

  從資料庫中直接刪除使用者

public class DeleteUser : IHttpHandler
    {

        public void ProcessRequest(HttpContext context)
        {
            context.Response.ContentType = "text/plain";
            int id;            
            if(int.TryParse(context.Request.QueryString["id"],out id))
            {
                userInfoBLL Bll = new userInfoBLL();
                if(Bll.DeleteUserInfo(id))
                {
                    //刪除成功後返回到handerUserinfo.ashx介面,重新資料庫資料
                    context.Response.Redirect("HanderUserInfo.ashx");
                }
                else
                {                
                    context.Response.Redirect("Error.html");
                }
            }
            else
            {
                context.Response.Write("引數錯誤");
            }
            
        }

        public bool IsReusable
        {
            get
            {
                return false;
            }
        }
    }

改:(update)

一個修改的靜態Html頁面

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title></title>
</head>
<body>
    <form method="post" action="Edituser.ashx">
        使用者名稱:<input type="text" name="txtName" value="$name"><br />
        密  碼:<input type="password" name="txtPwd" value="$pwd"><br />
        郵  箱:<input type="password" name="txtMail"value="$mail"><br />
        <input type="hidden" name="txtID" value="$Id" />
        <input type="submit" value="修改使用者" />
    </form>
</body>
</html>

將獲取的單個使用者資訊載入到靜態Html介面中

public class ShowEdit : IHttpHandler
    {

        public void ProcessRequest(HttpContext context)
        {
            context.Response.ContentType = "text/html";
            int id;
            if (int.TryParse(context.Request.QueryString["id"], out id))
            {
                userInfoBLL Bll = new userInfoBLL();
                userInfo user = Bll.GetUserInfo(id);
                if (user != null)
                {
                    //獲取模板路徑
                    string filepath = context.Request.MapPath("EditUser.html");
                    //讀取模板檔案內容,並給其賦值
                    string fileContent = File.ReadAllText(filepath);
                    fileContent = fileContent.Replace("$name", user.userName).Replace("$pwd", user.userPass).Replace("$mail", user.Email).Replace("$Id", user.Id.ToString());
                    //輸出給瀏覽器
                    context.Response.Write(fileContent);
                }
                else
                {
                    context.Response.Write("不存在該人資訊");
                }
            }
            else
            {
                context.Response.Write("引數錯誤");
            }        
        }

        public bool IsReusable
        {
            get
            {
                return false;
            }
        }
    }

修改使用者資訊,提交給資料庫

public class Edituser : IHttpHandler
    {

        public void ProcessRequest(HttpContext context)
        {
            context.Response.ContentType = "text/plain";
            int id = Convert.ToInt32(context.Request.Form["txtId"]);
            userInfoBLL bll = new userInfoBLL();
            userInfo user = bll.GetUserInfo(id);
            user.userName = context.Request.Form["txtName"];
            user.userPass= context.Request.Form["txtPwd"];
            user.Email = context.Request.Form["txtMail"];
            if(bll.UpdateUser(user))
            {
                context.Response.Redirect("HanderUserInfo.ashx");
            }
            else
            {
                context.Response.Redirect("Error.html");
            }        
        }

        public bool IsReusable
        {
            get
            {
                return false;
            }
        }
    }

擴充套件:一個出錯的HTML 介面

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title></title>   
    <script type="text/javascript">
      window.onload =function() {
          setTimeout(change,1000);
        }
        function change() {
            var time = document.getElementById("time").innerHTML;
            time = parseInt(time);
            time--;
            if (time < 1) {
                window.Location.href = "HanderUserInfo.ashx"
            }
            else {
                document.getElementById("time").innerHTML = time;
                setTimeout(change, 1000)
            }
        }     
    </script>
</head>
<body>
    伺服器忙!<span style="font-size:20px;color:red "id="time">5</span>秒鐘後自動跳轉<a href="HanderUserInfo.ashx">使用者列表</a>
</body>
</html>

總結

Winform窗體好比一個個的靜態的Html介面

winform窗體後面的程式碼,無論是獲取使用者資訊,還是對使用者資訊的操作都是一個個的動態介面,也就是所謂的C#程式碼介面。

效果展示:

今天的分享就先到這裡,下篇部落格我們將用aspx寫一遍增刪改查!