8.4 数据列表控件(GridView)

  GridView是ASP.NET中功能非常丰富的控件之一,它可以以表格的形式显示数据库的内容并通过数据源控件自动绑定和显示数据。开发人员能够通过配置数据源控件对GridView中的数据进行选择、排序、分页、编辑和删除功能进行配置。GridView控件还能够指定自定义样式,在没有任何数据时可以自定义无数据时的UI样式。
1.建立GridView控件
  GridView控件为开发人员提供了强大的管理方案,同样GridView也支持内置格式,单击【自动套用格式】连接可以选择GridView中的默认格式,如图8-34所示。
  GridView是以表格为表现形式,GridView包括行和列,通过配置相应的属性能够编辑相应的行的样式,同样也可以选择【编辑列】选项来编写相应的列的样式,如图8-35所示。
自动套用格式
图8-34 自动套用格式
编辑列
图8-35 编辑列
  GridView控件提供两个用户绑定到数据的选项,其一是使用DataSourceID进行数据绑定,这种方法通常情况下是绑定数据源控件;而另一种则是使用DataSource属性进行数据绑定,这种方法能够将GridView控件绑定到包括ADO.NET数据和数据读取器内的各种对象。
  使用DataSourceID进行数据绑定,可以让GridView控件能够自动的处理分页、选择等操作,如图8-36所示。而使用DataSource属性进行数据绑定,则需要开发人员通过编程实现分页等操作。GridView控件能够自定义字段,单击【添加列】按钮,可以选择相应类型的列。在添加列选项中,GridView控件支持多种列类型的列,包括复选框、图片、单选框、超链接等,如图8-37所示。
可选相应操作
图8-36 可选相应操作
添加字段
图8-37 添加字段
  添加自定义字段,GridView控件支持从数据源中读取相应的数据源来配置相应的字段,来让开发人员自定义的读取数据源中的相应字段来自定义开发,如图8-38所示。当选择从数据源中获取文本,可以通过Format的形式编写相应的文本。例如,从数据源中获取title列,而显示文本为“这是一个标题:title值”,则可以编写为“这是一个标题:{0}”,如图8-39所示。
添加字段
图8-38 添加字段
格式化字符串输出
图8-39 格式化字符串输出
配置完成后,GridView控件的HTML标签生成代码如下所示:
+展开
-HTML
    <asp:GridView ID="GridView1" runat="server" AllowPaging="True" 
        AllowSorting="True" AutoGenerateColumns="False" 
        BackColor="LightGoldenrodYellow" BorderColor="Tan" BorderWidth="1px" 
        CellPadding="2" DataKeyNames="ID" DataSourceID="SqlDataSource1" 
        ForeColor="Black" GridLines="None" Width="100%">

            <FooterStyle BackColor="Tan" />
                <Columns>
                    <asp:BoundField DataField="ID" HeaderText="ID" InsertVisible="False" 
                        ReadOnly="True" SortExpression="ID" />

                    <asp:BoundField DataField="TITLE" HeaderText="TITLE" SortExpression="TITLE" />
                    <asp:HyperLinkField DataNavigateUrlFields="ID" 
                        DataNavigateUrlFormatString="Default.aspx?uid={0}" DataTextField="TITLE" 
                        DataTextFormatString="Title:{0}" HeaderText="Link" />

                </Columns>
            <PagerStyle BackColor="PaleGoldenrod" ForeColor="DarkSlateBlue" 
             HorizontalAlign="Center" />

            <SelectedRowStyle BackColor="DarkSlateBlue" ForeColor="GhostWhite" />
            <HeaderStyle BackColor="Tan" Font-Bold="True" />
         <AlternatingRowStyle BackColor="PaleGoldenrod" />
    </asp:GridView>

  上述代码使用了一个默认格式,并新建了一个超链接文本类型的列,当单击超文本链接,则会跳转到另一个页面。

2.GridView控件的常用事件
  GridView支持多个事件,通常对GridView 控件进行排序、选择等操作时,同样会引发事件,当创建当前行或将当前行绑定至数据时发生的事件,同样,单击一个命令控件时也会引发事件。GridView 控件常用的事件如下所示。
1)RowCommand:在 GridView 控件中单击某个按钮时发生。此事件通常用于在该控件中单击某个按钮时执行某项任务。
2)PageIndexChanging:在单击页导航按钮时发生,但在 GridView 控件执行分页操作之前。此事件通常用于取消分页操作。
3)PageIndexChanged:在单击页导航按钮时发生,但在 GridView 控件执行分页操作之后。此事件通常用于在用户定位到该控件中不同的页之后需要执行某项任务时。
4)SelectedIndexChanging:在单击GridView控件内某一行的Select按钮(其CommandName 属性设置为“Select”的按钮)时发生,但在GridView控件执行选择操作之前。此事件通常用于取消选择操作。
5)SelectedIndexChanged:在单击 GridView 控件内某一行的 Select 按钮时发生,但在 GridView 控件执行选择操作之后。此事件通常用于在选择了该控件中的某行后执行某项任务。
6)Sorting:在单击某个用于对列进行排序的超链接时发生,但在 GridView 控件执行排序操作之前。此事件通常用于取消排序操作或执行自定义的排序例程。
7)Sorted:在单击某个用于对列进行排序的超链接时发生,但在 GridView 控件执行排序操作之后。此事件通常用于在用户单击对列进行排序的超链接之后执行某项任务。
8)RowDataBound:在 GridView 控件中的某个行被绑定到一个数据记录时发生。此事件通常用于在某个行被绑定到数据时修改该行的内容。
9)RowCreated:在GridView控件中创建新行时发生。此事件通常用于在创建某个行时修改该行的布局或外观。
10)RowDeleting:在单击 GridView 控件内某一行的 Delete 按钮(其 CommandName 属性设置为“Delete”的按钮)时发生,但在 GridView 控件从数据源删除记录之前。此事件通常用于取消删除操作。
11)RowDeleted:在单击 GridView 控件内某一行的 Delete 按钮时发生,但在 GridView 控件从数据源删除记录之后。此事件通常用于检查删除操作的结果。
12)RowEditing:在单击 GridView 控件内某一行的 Edit 按钮(其 CommandName 属性设置为“Edit”的按钮)时发生,但在GridView控件进入编辑模式之前。此事件通常用于取消编辑操作。
13)RowCancelingEdit:在单击 GridView 控件内某一行的 Cancel 按钮(其 CommandName 属性设置为“Cancel”的按钮)时发生,但在 GridView 控件退出编辑模式之前。此事件通常用于停止取消操作。
14)RowUpdating:在单击 GridView 控件内某一行的 Update 按钮(其 CommandName 属性设置为“Update”的按钮)时发生,但在 GridView 控件更新记录之前。此事件通常用于取消更新操作。
15)RowUpdated:在单击GridView控件内某一行的 Update 按钮时发生,但在 GridView 控件更新记录之后。此事件通常用来检查更新操作的结果。
16)DataBound:此事件继承自 BaseDataBoundControl 控件,在GridView控件完成到数据源的绑定后发生。
  需要指定相应的事件,则必须添加一个RowCommand事件,GridView控件HTML代码如下所示.
+展开
-HTML
    <asp:GridView ID="GridView1" runat="server" AllowPaging="True" 
     AllowSorting="True" AutoGenerateColumns="False" 
     BackColor="LightGoldenrodYellow" BorderColor="Tan" BorderWidth="1px" 
     CellPadding="2" DataKeyNames="ID" DataSourceID="SqlDataSource1" 
     ForeColor="Black" GridLines="None" onrowcommand="GridView1_RowCommand" 
     Width="100%">

        <FooterStyle BackColor="Tan" />
            <Columns>
                <asp:BoundField DataField="ID" HeaderText="ID" InsertVisible="False" 
                ReadOnly="True" SortExpression="ID" />

                <asp:BoundField DataField="TITLE" HeaderText="TITLE" SortExpression="TITLE" />
                <asp:HyperLinkField DataNavigateUrlFields="ID" 
                DataNavigateUrlFormatString="Default.aspx?uid={0}" DataTextField="TITLE" 
                DataTextFormatString="Title:{0}" HeaderText="Link" />

                    <asp:ButtonField ButtonType="Button" CommandName="
                    Select"
 HeaderText="选择按钮" ShowHeader="True" Text="按钮" />

            </Columns>
        <PagerStyle BackColor="PaleGoldenrod" ForeColor="DarkSlateBlue" 
         HorizontalAlign="Center" />

        <SelectedRowStyle BackColor="DarkSlateBlue" ForeColor="GhostWhite" />
        <HeaderStyle BackColor="Tan" Font-Bold="True" />
    <AlternatingRowStyle BackColor="PaleGoldenrod" />
    </asp:GridView>

  上述代码创建了一个GridView控件,并增加了一个按钮控件,并且为按钮控件的CommandName属性赋值为Select,当单击按钮控件时,则会触发RowCommand事件,CS页面代码如下所示。
+展开
-C#
        protected void GridView1_RowCommand(object sender, GridViewCommandEventArgs e)
        {
            Label1.Text = e.CommandName + "事件被触发";
        }

  当单击按钮时,GridView控件会选择相应的行。在GridView控件的RowCommand事件中,同样可以通过GridView控件的中按钮的CommandArgument属性获取相应的操作并执行相应代码。GridView控件运行结果如图8-40和图8-41所示。
GridView控件的事件
图8-40 GridView控件的事件
触发Select选择事件
图8-41 触发Select选择事件
注意:在执行其他事件时,如RowDeleted、GridView控件首先执行RowDataBound代码,然后执行RowCommnad、RowDeleting以及RowDeleted等事件。

加支付宝好友偷能量挖...


评论(0)网络
阅读(147)喜欢(0)Asp.Net/C#/WCF