NET开发DataList绑定数据源 [复制链接]

1.概述

在ASP.NETWebForm中，除了使用GridView控件可以绑定数据源显示数据之外，还可以使用DataList控件。

DataList控件必须使用模版来定义布局，不支持分页和排序，没有GridView控件功能强大，DataList在显示数据上性能要比GridView高。一般使用DataList来布局一列多行的数据显示。

像如下图的布局，适合使用DataList控件来布局：

在这个布局中，一行显示了3列，并且每列中又显示了多行。

2.DataList绑定数据

使用DataList控件来绑定数据与GridView控件绑定数据的方式完全一样，都是需要在Page_Load的if(!IsPostBack)中来绑定数据源。DataList控件的数据源与GridView控件的数据源一样，可以是DataSet、DataTable、ListT等。

Aspx代码如下：

bodyformid=form1runat=serverdivaspataListID=DataList1runat=serverItemTemplatetableborder=1style=width:px;trtdstyle=width:px%#Eval(Name)%/tdtddiv%#Eval(Id)%/divdiv%#Eval(Age)%/divdiv%#Eval(Sex)==True?男:女%/divdiv%#Eval(CreateTime)%/div/td/tr/table/ItemTemplate/aspataList/div/form/body

在DataList控件中，对于正常项目的显示，都是在ItemTemplate模版中定义的，ItemTemplate称为项目模版或成员模版。并且与GridView一样，也是使用%#Eval(“字段名”)%的形式来绑定数据的。

Aspx.cs的C#代码如下：

DBHelperdb=newDBHelper();protectedvoidPage_Load(objectsender,EventArgse){if(!IsPostBack){this.DataList1.DataSource=db.GetDataTable(select*fromStudent);this.DataBind();}}现在查看一下效果：

从效果图上看，我们在一行中显示了多列数据，并且多个列可以任意的定义布局。而不像GridView那样，按表格的形式显示。

DataList控件也是使用DataSource属性指定数据源的，也是使用DataBind来绑定数据的。

3.DataList的模版

在WebForm的DataList中，有如下7种模版

ItemTemplate：项目模版或成员模版，用于显示正常数据的模版，DataList控件必须存在ItemTemplate模版。AlternatingItemTemplate：交替模版，用于交替显示数据的模版。EditItemTemplate：编辑模版，用于编辑时的模版。FooterTemplate：脚注模版，用于显示脚注信息。HeaderTemplate：头模版，用于显示头部信息。SelectedItemTemplate：选择模版，用于选择时的模版。SeparatorTemplate：分隔符模版，用于显示分隔符信息。4.DataList相关属性

RepeatColumns属性RepeatColumns属性用于设置DataList控件每行显示多少列。默认RepeatColumns=1，每行只显示一列。

现在设置RepeatColumns=2，查看一下效果：

“姓名”和“年龄”是一个整体，放在一起表示一列，那么在上图中就表示有2列，每列中有一个“姓名”和一个“年龄”。

GridLines属性GridLines属性用于设置DataList控件的网格线样式，默认值是None。该属性是枚举类型，如下说明：

Both：同时呈现水平和垂直网络线。Horizontal：只呈现水平网络线。Vertical：只呈现垂直网络线。RepeatLayout属性RepeatLayout属性用于获取或设置DataList控件是在表中显示还是在流布局中显示。

5.操作数据

删除这里我们使用ItemTemplate模版在DataList中删除和编辑数据。在ItemTemplate模版中添加文本框控件来显示数据的值,并且还可以直接编辑数据。

Aspx代码如下：

aspataListID=DataList1runat=serverItemTemplatediv姓名：aspextBoxID=txtNamerunat=serverText=%#Eval(Name)%/年龄：aspextBoxID=txtAgerunat=serverText=%#Eval(Age)%//div/ItemTemplate/aspataList运行效果如下图所示：

添加删除按钮对于在模版列中添加的各种控件，可以直接在模版列中拖放即可：

当然，也可以编辑模版，在模版中处理：

对于DataList控件中的删除按钮，要想实现删除功能，也是需要设置CommandName和CommandArgument属性。如下代码：

asp:ButtonID=Button1CommandName=DelCommandArgument=%#Eval(Id)%runat=serverText=删除/

这两个属性与GridView控件的这两个属性是一样的。

添加事件代码打开DataList控件的“属性”窗口，如下图所示：

在上图的ItemCommand事件中双击，会自动生成命令事件处理程序的C#代码：

现在开始编写ItemCommand事件C#代码来实现删除功能。

protectedvoidBindToData(){this.DataList1.DataSource=db.GetDataTable(select*fromStudent);this.DataBind();}

protectedvoidDataList1_ItemCommand(objectsource,DataListCommandEventArgse){stringcmdName=e.CommandName;objectid=e.CommandArgument;if(cmdName==Del)//删除{introws=db.ExecuteNonQuery(deletefromStudentwhereId=+id);if(rows=1){this.BindToData();Response.Write(scriptalert(删除成功！)/script);}}}实现的代码与GridView控件的删除功能代码完全一样。

编辑添加编辑按钮在ItemTemplate模版中添加一个“编辑”按钮。如下图所示：

在上图中的“编辑”按钮中修改CommandName、CommandArgument属性的值。

添加事件代码编写ItemCommand事件C#代码如下：

protectedvoidDataList1_ItemCommand(objectsource,DataListCommandEventArgse){stringcmdName=e.CommandName;objectid=e.CommandArgument;if(cmdName==Del)//删除{introws=db.ExecuteNonQuery(deletefromStudentwhereId=+id);if(rows=1){this.BindToData();Response.Write(scriptalert(删除成功！)/script);}}if(e.CommandName==Upt)//编辑{}}在这里，当点击了“编辑”按钮，就会将当前页面中修改的内容更新到数据库中。

实现修改功能我们可以直接在ItemCommand事件中实现编辑功能：

protectedvoidDataList1_ItemCommand(objectsource,DataListCommandEventArgse){stringcmdName=e.CommandName;objectid=e.CommandArgument;if(cmdName==Del)//删除{introws=db.ExecuteNonQuery(deletefromStudentwhereId=+id);if(rows=1){this.BindToData();Response.Write(scriptalert(删除成功！)/script);}}if(e.CommandName==Upt)//编辑{//查找到姓名文本框控件TextBoxtxtName=e.Item.FindControl(txtName)asTextBox;//查找到年龄文本框控件TextBoxtxtAge=e.Item.FindControl(txtAge)asTextBox;//更新SQL语句stringsql=string.Format(updateStudentsetName={0},Age={1}whereId={2},txtName.Text,txtAge.Text,id);//实现更新操作introws=db.ExecuteNonQuery(sql);if(rows=1){this.BindToData();Response.Write(scriptalert(更新成功！)/script);}}}使用e.Item.FindControl(txtName)可以用来在模版中查找控件。

这里除了查找控件之外，其它的都与GridView控件的更新操作一样。

运行效果如下图所示：

在上图中输入新的内容，点击“编辑”按钮：

此时提示数据已更新成功。现在查看一下SQLServer数据库中是否已将数据更新过来了。如下图所示：

在上图中，Student表中，Id=4的行数据已更新成功了。

6.分页

概述由于DataList控件不支持分页功能，所以只能借助于第三方的分页控件来实现分页功能。

AspNetPager是分页控件，针对ASP.NET分页控件的不足，提出了与众不同的解决asp.net中分页问题的方案，即将分页导航功能与数据显示功能完全独立开来。

由用户自己控制数据的获取及显示方式，因此可以被灵活地应用于任何需要实现分页导航功能的地方，如为GridView、DataList以及Repeater等数据绑定控件实现分页、呈现自定义的分页数据以及制作图片浏览程序等，因为AspNetPager控件和数据是独立的，因此要分页的数据可以来自任何数据源，如SQLServer、Oracle、Access、mysql、DB2等数据库以及XML文件、内存数据或缓存中的数据、文件系统等等。

配置将下载好的dll放在项目的bin文件夹中，然后在项目中添加“AspNetPager.dll”的引用。

编写Aspx代码将分页的代码放在DataList控件的下面：

divaspataListID=DataList1RepeatColumns=1runat=serverOnItemCommand=DataList1_ItemCommandItemTemplatediv姓名：aspextBoxID=txtNamerunat=serverText=%#Eval(Name)%/年龄：aspextBoxID=txtAgerunat=serverText=%#Eval(Age)%/asp:ButtonID=Button1CommandName=DelCommandArgument=%#Eval(Id)%runat=serverText=删除OnClientClick=returnconfirm(真的要删除吗？)/asp:ButtonID=Button2runat=serverText=编辑CommandName=UptCommandArgument=%#Eval(Id)%//div/ItemTemplate/asp:DataListwebdiyer:AspNetPagerID=AspNetPager1runat=serverShowPageIndexBox=AlwaysCurrentPageButtonPosition=CenterTextBeforePageIndexBox=跳转到第TextAfterPageIndexBox=页Width=%HorizontalAlign=LeftPagingButtonSpacing=10FirstPageText=首页LastPageText=尾页NextPageText=下一页PrevPageText=上一页/webdiyer:AspNetPager/div

效果如下：

在上图中已经看到分页的效果了。

添加分页事件现在编写能够从SQLServer数据库正确获取分页数据的C#代码：

在上图中双击“PageChanged”事件，设置分页C#代码：

编写C#代码获取总记录数由于AspNetPager分页控件需要知道控制分页数据源的总记录数。如下C#代码：

///summary///获取记录的总数////summary///returns/returnspublicintGetAllRecordCount(){stringsql=selectCOUNT(Id)fromStudent;returnConvert.ToInt32(db.GetExecuteScal(sql));}使用COUNT()函数获取表中所有记录的总数。

分页数据源对于AspNetPager分页控件，所分页的数据源是需要传相应的分页参数的。如下C#代码：

///summary///分页数据源////summary///paramname=pageSize/param///paramname=pageIndex/param///returns/returnspublicDataTableGetInfoByPage(intpageSize,intpageIndex){stringsql=string.Format(selecttop{0}*from(selectROW_NUMBER()over(orderbyId)nid,*fromStudent)astempwherenid{1},pageSize,(pageIndex-1)*pageSize);returndb.GetDataTable(sql);}这里使用了ROW_NUMBER()函数实现分页。

Page_Load代码在Page_Load中编写如下C#代码：

DBHelperdb=newDBHelper();protectedvoidPage_Load(objectsender,EventArgse){if(!IsPostBack){AspNetPager1.RecordCount=GetAllRecordCount();AspNetPager1.PageSize=3;this.BindToData();}}RecordCount属性指定记录的总数。PageSize指定一页显示多少条记录。

绑定数据源现在将可以分页的数据源绑定到DataList控件，C#代码如下：

///summary///绑定数据源////summaryprotectedvoidBindToData(){this.DataList1.DataSource=GetInfoByPage(3,this.AspNetPager1.CurrentPageIndex);this.DataBind();}可见，分页数据是来自数据源的，数据源要具有分页功能。

分页事件最后将绑定的数据放在分页事件中，如下C#代码：

///summary///分页事件////summary///paramname=sender/param///paramname=e/paramprotectedvoidAspNetPager1_PageChanged(objectsender,EventArgse){this.BindToData();}查看分页经过以上的C#代码编写，就完成了分页操作，下面运行一下结果，如下图所示：

第一次显示数据，显示的是第一页的数据。

当点击第2页时，数据发生变化。

同样，第3页数据显示出来了。

通过以上对ASP.NETWebForm中DataList控件的详细讲解，我们就可以使用DataList在前台页面上显示商品列表。

对于大部分的.NET开发，GridView控件常用于后台系统的开发，DataList控件常用于前台系统的开发。