asp.net使用三层架构实现简单的增删改查（4）—— 查出数据库所有数据然后用表格展示出来

我想了一下是一层一层的写还是一个功能一个功能的写，决定完成一个功能再进行下一个，这样可以让每个功能更有连贯性，看起来更容易理解。之后写完再一层一层的看就好啦。
今天我们要完成的功能是用一个表格先将数据库的数据展示出来（之后的增删改查是在这个表格之上进行的操作，所以把展示内容放在了第一步）。这也相当于是一个查询功能。
1.现在我们是进行单个功能的层次化编写。就决定从下层往上层开始写吧！来到DAL（数据库访问层），因为我们要查数据库的所有数据（可能不止一条），所以应该用List<>来接收多个model的集合。
（1）添加必要的命名空间
在这里插入图片描述
（2）对查询方法SeachList(string _where)进行编写

public List<Model.Model> SearchList(string _where)
        {
            List<Model.Model> list = new List<Model.Model>();
            SqlHelper sqlhep = new SqlHelper();
            string str = "select * from ThreeLayer_Test where 1=1 " + _where + " ";
            DataTable table = sqlhep.ExecuteDataTable(str);
            if (table.Rows.Count > 0)
            {
                foreach (DataRow item in table.Rows)
                {
                    list.Add(new Model.Model()
                    {
                        Indentity = item["indentity"].ToString(),
                        Name = item["name"].ToString(),
                        Gender = item["gender"].ToString(),
                    });
                }
            }
            return list;
        }

注：这里解释一些_where这个参数，现在我们进行的查询数据库的所有内容（即有什么装什么），但是我们之后的查询是一个条件查询，所以我们需要一个参数。这里的想法是结合sqlsever语句传一个字符串进来，这个字符串是在Handler.ashx里对传入的indentity（条件）进行拼接的结果。意思就是，如果indentity为空相当于没有条件，就是查询所有数据，如果indentity有值，即查询符合indentity条件的数据。
下面是Handler.ashx里的内容放在这里方便查看理解。
在这里插入图片描述
注：这里的indentity是你之后会在页面上输入的数据，现在结合上面的语句就可以知道为什么要这样写啦。不清楚的可以百度一下sqlserver条件查询语句哦！
2.现在我们去到BLL（业务逻辑）层！它比较简单，它的作用就是一个过渡层。对于数据访问层而言,它是调用者;对于表示层而言,它却是被调用者。

 public List<Model.Model> SearchList(string _where)
        {
            return dal.SearchList(_where);
       }

3.现在我们去到前端界面！
（1）建立一个html文件（注意它放的位置）
在这里插入图片描述
（2）开始编写（我们先进行简单的排版即可，如果想进行优化，我们之后再来完成）。记得引入js文件哦（没有的话先去官网下载https://jquery.com/download/）下载之后放在项目中再进行引用。

（3）来吧，现在我们先做一个简单的页面！

<table>
            <tr>
                <td>身份证号：</td>
                <td><input /></td>
                <td><button>查询</button></td>
            </tr>
            <tr>
                <td><button>添加</button></td>
                <td><button>修改</button><button>删除</button></td>
                <td></td>
            </tr>
        </table>
    </div>
   <div id="list"></div>

注意个id=“list”的div，我们这里是想动态生成一个表，div是承载这个表的容器。
（4）好啦,现在我们来进行function()的编写吧！

<script>
search("")
 function search(_indentity)
        {
            $.ajax({
                type: 'POST',
                url: "Handler.ashx",
                data: {
                    type: "searchlist",
                    indentity:_indentity
                },
                success: function (result) {
                    var json = JSON.parse(result);
                    if (json.Status == 1) console.log(json.Data);
                    {
                        var str = "";
                        str += '<table style="text-align:center">';
                        str += '<tr>';
                        str += '<th style="width:200px">姓名</th>';
                        str += '<th style="width:200px">性别</th>';
                        str += '<th style="width:200px">身份证号</th>';
                        str += '</tr>';
                    }
                    for (var i = 0; i < json.Data.length; i++) {
                        str += '<tr>';
                        str += '<td>' + json.Data[i].Name + '</td>';
                        str += '<td>' + json.Data[i].Gender + '</td>';
                        str += '<td>' + json.Data[i].Indentity + '</td>';
                        str += '</tr>';
                    }
                    str += '</table>';
                    $("#list").html(str);
                }
            })
        }
</script>

这里最麻烦的就是动态表的实现。第一行的search("")表示我加载这个页面的时候就执行这个search(""),传入一个空字符串，相当于不添加条件，即查询所有内容，和我上面讲的相对应哦，如果不清楚这个ajax请求，可以去看我之前写过的一篇文章（https://blog.csdn.net/qq_40422692/article/details/107509382）
4.注意到ajax里面的url了吗，Handler.ashx就是我们现在要完成的内容啦（这里面如果有不理解也可以看上面那个链接里的文章）
（1）首先:先建立一个Handler.ashx
在这里插入图片描述

（2）建立好啦，现在我们来编写里面的内容吧（有不理解看上面的链接哦）

using System.Collections.Generic;
using System.Linq;
using System.Web;
using BLL;
using Model;
namespace ThreeLayer
{
    /// <summary>
    /// Summary description for Handler
    /// </summary>
    public class Handler : IHttpHandler
    {

        public void ProcessRequest(HttpContext context)
        {
            context.Response.ContentType = "text/plain";
            var type = context.Request["type"];
            if(type == "searchlist")
            {
                SearchList(context);
            }
        }

        public void SearchList(HttpContext context)
        {
            Bll bll = new Bll();
            var indentity = context.Request["indentity"];
            var _where = "";
            if (!string.IsNullOrEmpty(indentity))
            {
                _where = "and indentity like '%" + indentity + "%'";
            }
            ReasultModel resmodel = new ReasultModel();
            List<Model.Model> modelist = bll.SearchList(_where);
            resmodel.Status = 1;
            resmodel.Data = modelist;
            var result = Newtonsoft.Json.JsonConvert.SerializeObject(resmodel);
            context.Response.Write(result);
        }
        public class ReasultModel
        {
            public int Status { get; set; }
            public string Msg { get; set; }
            public object Data { get; set; }
            public string Deg { get; set; }
        }
        public bool IsReusable
        {
            get
            {
                return false;
            }
        }
    }
}

对啦：这里我们需要引用一个包（因为我们需要处理json数据，所以我们需要Newtonsoft Json工具），详细过程在这里看哦。（https://jingyan.baidu.com/article/d2b1d102da01645c7e37d4da.html）
5.因为我们没有做添加功能，所以我们先手动在数据库里添加一些数据，来测试一下吧！下面是我的运行结果（界面还不是很好看）
在这里插入图片描述
随意优化一下页面吧

这个过程就完成啦！
（优化的地方：表格居中，表格边框线，表格内字体居中，调节控件间距）有需要可以百度哦！

asp.net使用三层架构实现简单的增删改查（4）—— 查出数据库所有数据然后用表格展示出来

猜你喜欢