ASP.NET 数据绑定详解代码+步骤

白水baishui

于 2020-04-29 21:25:14 发布

阅读量4.7k

点赞数 33

分类专栏： # ASP.NET 文章标签：数据库 asp.net 数据绑定控件 ListView

本文链接： https://blog.csdn.net/baishuiniyaonulia/article/details/105796683

版权

ASP.NET 专栏收录该内容

10 篇文章 8 订阅

订阅专栏

1. 数据绑定概述

数据绑定指的是从数据源获取数据，或者向数据源写入数据。主要有两种形式：简单数据绑定和数据控件绑定。

其中简单数据绑定分为属性绑定、表达式绑定、集合绑定和方法绑定；数据控件绑定分为ListControl 控件、GridView 控件、DataList 控件和ListView控件

2. 简单数据绑定

2.1. 属性绑定

基于属性的数据绑定所涉及的属性必须要包含Get访问器，它的基本语法为：

<%# 属性名称 %>

如果在ASP页面中对属性进行了绑定，那么需要调用Page类的DataBind方法才能执行绑定操作，例如下例：

// .aspx文件
<body>
    <form id="form1" runat="server">
        <div>
        	<!-- 数据绑定 -->
            <asp:Label ID="Label1" runat="server" Text="图书名称："><%# BookName %></asp:Label>
        </div>
        <div>
        	<!-- 数据绑定 -->
            <asp:Label ID="Label2" runat="server" Text="图书价格："><%# BookPrice %></asp:Label>
        </div>
    </form>
</body>

// .aspx.cs文件
// BookName属性
public string BookName {
    get {
        return "ASP.NET程序设计";
    }
}

// BookPrice属性
public string BookPrice {
    get {
        return "49";
    }
}

protected void Page_Load(object sender, EventArgs e){
    // 调用DataBind()方法执行绑定
    Page.DataBind();
}

执行结果如下：

2.2. 表达式绑定

表达式绑定的语法与属性绑定一致，它可以在属性绑定的基础上通过表达式对数据进行处理，它的语法如下：

<%# 表达式 %>

例如在属性绑定的基础上，要查询10本书的总价格，则代码如下：

// .aspx文件
<body>
    <form id="form1" runat="server">
        <div>
        	<!-- 数据绑定 -->
            <asp:Label ID="Label1" runat="server" Text="图书名称："><%# BookName %></asp:Label>
        </div>
        <div>
        	<!-- 表达式绑定 -->
            <asp:Label ID="Label2" runat="server" Text="图书价格："><%# Convert.ToInt32(BookPrice)*10 %></asp:Label>
        </div>
    </form>
</body>

// .aspx.cs文件
// BookName属性
public string BookName {
    get {
        return "ASP.NET程序设计";
    }
}

// BookPrice属性
public string BookPrice {
    get {
        return "49";
    }
}

protected void Page_Load(object sender, EventArgs e){
    // 调用DataBind()方法执行绑定
    Page.DataBind();
}

执行结果如下所示

2.3. 集合绑定

有一些服务器控件是多记录控件，如DropDownList控件，这类控件即可使用集合作为数据源对其进行绑定。通常情况下，集合数据源主要包括ArrayList、Hashtabel、 DataView、 DataReader 等。

例如下面代码，实现了对DropDownList控件进行数据绑定：

// .aspx文件
<body>
    <form id="form1" runat="server">
        <div>
            <asp:Label ID="Label1" runat="server" Text="图书名称："></asp:Label>
            <asp:DropDownList ID="DropDownList1" runat="server"></asp:DropDownList>
        </div>
    </form>
</body>

protected void Page_Load(object sender, EventArgs e){
    // 构建数据源
    ArrayList arrayList = new ArrayList();
    arrayList.Add("iisexpress");
    arrayList.Add("assembly");
    arrayList.Add("Windows");

	// 指定数据源
    DropDownList1.DataSource = arrayList;
    // 数据绑定
    DropDownList1.DataBind();
}

执行结果如下：

2.4. 方法绑定

方法的绑定与属性绑定的语法是一致的，只不过把绑定对象更替为了方法，例如下面的代码：

// .aspx文件
<body>
    <form id="form1" runat="server">
        <div>
        	<!-- 数据绑定 -->
            <asp:Label ID="Label1" runat="server" Text="图书名称："><%# BookName %></asp:Label>
        </div>
        <div>
        	<!-- 方法绑定 -->
            <asp:Label ID="Label2" runat="server" Text="图书价格："><%# PriceTest("49") %></asp:Label>
        </div>
    </form>
</body>

// .aspx.cs文件
public string PriceTest(string _price) {
    return _price;
}

protected void Page_Load(object sender, EventArgs e){
    // 调用DataBind()方法执行绑定
    Page.DataBind();
}

执行结果如下：

3. 数据控件绑定

3.1. ListControl 控件

ListControl控件用来定义所有列表类型控件的所有属性方法和事件，是一个抽象基类，它能够控制的控件主要包括：DropDownList控件、ListBox控件、CheckBoxList控件、RadioButtonList控件。

ListControl控件能够指定能够用来填充列表控件的数据源，其中与数据绑定修改的属性有：

DataSource属性，用来设置数据源
DataTextField属性，用来指定提供文本内容的数据源字段
DataValueField属性，用来指定提供值的数据源字段

例如下面代码，将图书列表以DropDownList控件进行显示，当用户选择了DropDownList控件中的某个值后，页面会进行相应的信息更新。

// .aspx文件
<body>
    <form id="form1" runat="server">
        <div>
        	<!-- ListControl控件绑定DropDownList -->
            <asp:Label ID="Label1" runat="server" Text="图书列表："><%# BookName %></asp:Label>
            <asp:DropDownList ID="DropDownList1" runat="server" AutoPostBack="True" OnSelectedIndexChanged="DropDownList1_SelectedIndexChanged"></asp:DropDownList>
        </div>
        <div>
            <asp:Label ID="Label2" runat="server" Text="图书编码："></asp:Label>
            <asp:Label ID="Label3" runat="server" Text=""></asp:Label>
        </div>
        <div>
            <asp:Label ID="Label4" runat="server" Text="图书名称："></asp:Label>
            <asp:Label ID="Label5" runat="server" Text=""></asp:Label>
        </div>
    </form>
</body>

// .aspx.cs文件
protected void Page_Load(object sender, EventArgs e){
    if (!IsPostBack) {
        SqlConnection sqlConnection = new SqlConnection("Server=DEITIVOD;Database=db_LibraryMS;User Id=sa;pwd=admin");
        SqlDataAdapter sqlDataAdapter = new SqlDataAdapter("select book_code, book_name from tb_bookinfo;", sqlConnection);

        // 将查询到的数据放入一个DataSet
        DataSet dataSet = new DataSet();
        sqlDataAdapter.Fill(dataSet);

        // 对DropDownList执行指定数据源和数据绑定
        DropDownList1.DataSource = dataSet;
        DropDownList1.DataTextField = "book_name"; // 指定要显示的字段
        DropDownList1.DataValueField = "book_code"; // 指定要绑定的主键值
        DropDownList1.DataBind();
    }
}

protected void DropDownList1_SelectedIndexChanged(object sender, EventArgs e){
    Label3.Text = DropDownList1.SelectedValue;
    Label5.Text = DropDownList1.SelectedItem.Text;
}

执行效果如下：
数据库中的tb_bookinfo数据表的数据如下所示：

ASP页面中显示的数据：

3.2. GridView 控件

GridView控件可称之为数据表格控件，它以表格的形式显示数据源中的数据，每列表示一个字段，而每行表示一条记录，可以将其理解为数据库技术中的视图。

3.2.2. 使用GridView控件绑定数据源

使用GridView控件绑定数据源主要用到

DataSource属性，用来指定数据源
DataBind方法，用来执行数据绑定

如下代码实现了将SQL Server数据库中的数据通过GridView控件显示到ASP页面中

// .aspx文件
<body>
    <form id="form1" runat="server">
        <div>
        	<!-- GridView控件绑定数据源 -->
            <asp:GridView ID="GridView1" runat="server" CellPadding="4" ForeColor="#333333" GridLines="None">
                <AlternatingRowStyle BackColor="White" ForeColor="#284775" />
                <EditRowStyle BackColor="#999999" />
                <FooterStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
                <HeaderStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
                <PagerStyle BackColor="#284775" ForeColor="White" HorizontalAlign="Center" />
                <RowStyle BackColor="#F7F6F3" ForeColor="#333333" />
                <SelectedRowStyle BackColor="#E2DED6" Font-Bold="True" ForeColor="#333333" />
                <SortedAscendingCellStyle BackColor="#E9E7E2" />
                <SortedAscendingHeaderStyle BackColor="#506C8C" />
                <SortedDescendingCellStyle BackColor="#FFFDF8" />
                <SortedDescendingHeaderStyle BackColor="#6F8DAE" />
            </asp:GridView>
        </div>
    </form>
</body>

// .aspx.cs文件
 protected void Page_Load(object sender, EventArgs e){
    SqlConnection sqlConnection = new SqlConnection("Server=DEITIVOD;Database=db_LibraryMS;User Id=sa;pwd=admin");
    SqlDataAdapter sqlDataAdapter = new SqlDataAdapter("select * from leaveword;", sqlConnection);

    DataSet dataSet = new DataSet();
    sqlDataAdapter.Fill(dataSet);

    GridView1.DataSource = dataSet; // 指定数据集
    GridView1.DataBind(); // 执行数据绑定
}

数据库中leaveword数据表的数据如下所示：

执行效果如下，ASP页面中显示的数据：

3.2.3. 自定义GridView控件的列字段名

GridView中的数据列分为7种类型

数据列	说明
BoundFiled	最常用的数据列，用来显示文本
CheckBoxFiled	用来显示Boolean值
CommandFiled	用来显示执行选择、编辑和删除操作的命令按钮
ImageFiled	用来显示图片
HyperLinkFiled	用来将数据以超链接的形式显示出来
ButtonFiled	用来为GridView控件创建命令按钮，该按钮可以操作其所在行的数据
TemplateFiled	用来给用户提供自定义类型的数据列

在VS开发环境中按下面的步骤操作，以BoundFiled 为例将GridView中的字段名修改为中文显示：

如果只想显示我们自定义的列，可以将AutoGenerateColumns设置为False
上面两张图的内容也可以通过下面的代码实现：

// .aspx文件
<body>
    <form id="form1" runat="server">
        <div>
        	<!-- GridView控件绑定数据源，并且自定义列 -->
            <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False">
                <Columns>
                    <asp:BoundField DataField="title" HeaderText="图书编号" />
                    <asp:BoundField DataField="email" HeaderText="邮箱" />
                    <asp:BoundField DataField="context" HeaderText="内容" />
                </Columns>
            </asp:GridView>
        </div>
    </form>
</body>

// .aspx.cs文件
protected void Page_Load(object sender, EventArgs e){
    SqlConnection sqlConnection = new SqlConnection("Server=DEITIVOD;Database=db_LibraryMS;User Id=sa;pwd=admin");
    SqlDataAdapter sqlDataAdapter = new SqlDataAdapter("select * from leaveword;", sqlConnection);

    DataSet dataSet = new DataSet();
    sqlDataAdapter.Fill(dataSet);

    GridView1.DataSource = dataSet; // 指定数据集
    GridView1.DataBind(); // 执行数据绑定
}

效果如下，左边是直接指定数据源时的表格，右边是对列自定义的表格：

3.2.4. 使用GridView控件分页显示数据

使用GridView控件分页显示数据主要用到了以下两个属性和一个事件：

AllowPaging属性，用来决定是否启用分页功能
PageSize属性，设置分页时每页显示几条记录，默认是12条
PageIndexChanging事件，用来响应用户的页面切换指令

下图的GridView属性说明了该GridView开启了分页功能，每页是展示3条记录
下面的代码，在开启分页功能的基础上重写了PageIndexChanging事件，实现了GridView的分页功能：

// .aspx文件
<body>
    <form id="form1" runat="server">
        <div>
        	<!-- GridView控件绑定数据源，并且使用分页功能 -->
            <asp:GridView ID="GridView1" runat="server" AllowPaging="True" OnPageIndexChanging="GridView1_PageIndexChanging" PageSize="3">
            </asp:GridView>
        </div>
    </form>
</body>

// .aspx.cs文件
protected void Page_Load(object sender, EventArgs e){
	    SqlConnection sqlConnection = new SqlConnection("Server=DEITIVOD;Database=db_LibraryMS;User Id=sa;pwd=admin");
    SqlDataAdapter sqlDataAdapter = new SqlDataAdapter("select * from leaveword;", sqlConnection);

    DataSet dataSet = new DataSet();
    sqlDataAdapter.Fill(dataSet);

    GridView1.DataSource = dataSet; // 指定数据集
    GridView1.DataBind(); // 执行数据绑定
}

protected void GridView1_PageIndexChanging(object sender, GridViewPageEventArgs e){
    // 设置当前页为新页
    GridView1.PageIndex = e.NewPageIndex;
    // 绑定新页数据
    GridView1.DataBind();
}

执行结果如下：

3.2.5. 选中、编辑和删除GridView数据项

在ASP.NET中实现选中、编辑和删除GridView数据项

3.3. DataList 控件

3.3.1. DataList 模板

DataList控件是一个常用的数据绑定控件，可以称之为迭代控件，该控件能够以某种设定好的模板格式循环显示多条数据，这种模板格式是可以根据需要进行自定义的，比较于GridView控件，虽然GridView控件功能非常强大，但它始终只能以表格的形式显示数据，而使用DataList控件则灵活性非常强，其本身就是一个富有弹性的控件。

DataList中一共有以下几种模板：

模板	说明
ItemTemplate	为项提供内容
AlternatingltemTemplate	为交替项提供内容，是ItemTemplate的扩展
SelectedltemTemplate	为当前选定项提供内容
EditltemTemplate	为当前编辑项提供内容
HeaderTemplate	为页眉提供内容
FooterTemplate	为页脚提供内容

3.3.2. 分页显示DataList控件中的数据

DataList本身不具有分页功能，为了实现分页功能，需要借助PagedDataSource类，例如这个例子

3.4. ListView控件

3.4.1. ListView控件概述

ListView控件用于显示数据，它提供了编辑、删除、插入、分页与排序等功能，ListView大部分的属性方法和事件与GridView和DataList一致，可以理解为GridView控件与DataList控件的融合，它具有GridView控件编辑数据的功能，同时又具有DataList控件灵活布局的功能。

3.4.2. ListView控件的模板

ListView控件有非常多的模板，其中最常用的有六个

模板	说明
ItemTemplate	为项提供内容
GroupTemplate	为组提供内容，它包含一个占位符对象，可以由其他模板中的内容进行替换
SelectedltemTemplate	为当前选定项提供内容
EditltemTemplate	为当前编辑项提供内容
InsertltemTemplate	为插入项提供内容
EmptyDataTemplate	在数据源未返回数据时提供内容

3.4.3. 使用ListView控件对数据进行显示、分页和排序

使用ListView控件对数据进行分页需要用到标签，这是一个用于分页的控件。排序需要用到CommandName属性，令其值为sort，指定要进行排序操作，然后再指定CommandArgument属性，令其值为要排序的列。

使用ListView控件显示数据只需配置数据源即可，而无需写任何一行操作数据库的代码，效果如下：
实现步骤

关注博主即可阅读全文

白水baishui

关注关注

33
点赞
踩
82

收藏

觉得还不错? 一键收藏
打赏
22
评论
ASP.NET 数据绑定详解代码+步骤

文章目录1. 数据绑定概述2. 简单数据绑定2.1. 属性绑定2.2. 表达式绑定2.3. 集合绑定2.4. 方法绑定3. 数据控件绑定3.1. ListControl 控件3.2. GridView 控件3.2.2. 使用GridView控件绑定数据源3.2.3. 自定义GridView控件的列字段名3.2.4. 使用GridView控件分页显示数据3.3. DataList 控件3.3.1. ...
复制链接

扫一扫