2.DataList控件
(1). DataList控件的常用属性
属性
|
说明
|
AlternatingItemTemplate
|
交替数据模板。若不定义该属性,表示数据均按ItemTemplate显示
|
Cellpadding
|
表格的单元格边框与表格内容的距离,单位为像素点数
|
CellSpacing
|
表格单元格间距,单位为像素点数
|
DataKeyField
|
主键字段的名称
|
DataSource
|
连接到DataList控件的数据源
|
EditItemTemplate
|
设置表格在激活编辑时的处理模板
|
FooterTemplate
|
设置数据页脚显示格式的模板,该模板内的数据只出现一次
|
HeaderTemplate
|
设置数据标题的模板,该模板内的数据只出现一次
|
Items
|
DataListItemCollection集合,该集合的二个重要属性是Count和Item(index)
|
ItemTemplate
|
设置数据显示方式的模板,这是必需的模板
|
SeparatorTemplate
|
设置数据之间分隔的显示格式
|
SelectedItemTemplate
|
激活时的模板
|
SelectedIndex
|
当前选取记录的下标
|
SelectedItem
|
当前选取记录,返回值为DataListItem对象
|
RepeaColumns
|
DataList控件显示的拦数
|
DataKeys
|
DataKeyCollection,即由DataKeyField属性指定的字段
|
(2). DataList控件的常用事件
事件
|
说明
|
OnItemCommand
|
当用户单击DataList控件中的Button、ImageButton或LinkButton等按钮控件触发此事件。该事件的参数为DataListCommandEventArgs,可取值为:(1)CommandArgument:获取按钮控件指定的选择参数(2)CommandName:获取按钮控件指定的命令名(3)CommandSource:获取被单击的按钮对象(4)Item:获取按钮对象所在的数据行,返回DataListItem对象
|
OnCancelCommand
|
当单击DataList控件的“取消”按钮时触发该事件,参数同上
|
OnEditCommnad
|
当单击DataList控件的“编辑”按钮时触发该事件,参数同上
|
OnDeleteCommand
|
当单击DataList控件的“删除”按钮时触发该事件,参数同上
|
OnUpdateCommand
|
当单击DataList控件的“更新”按钮时触发该事件,参数同上
|
(3).模板的显示样式
属性共有:AlternatingItemStyle、EditItemStyle、HeaderStyle、ItemStyle、SelectedItemStyle和SeparatorStyle
样式属性:
BackColor:背景色
BorderColor:边框颜色
BorderStyle:边框类型,可取值为NotSet、None、Dotted、Dashed、Solid、Double、Groove、Ridge、Inset或Outset
BorderWidth:边框大小
Font:字体样式
ForeColor:前景颜色
Height:对象高度
HorizontalAlign:单元格的水平对齐方式,可取值为Center、Justify、Left、NotSet或Right
VerticalAlign:单元格的垂直对齐方式,可取值为Bottom、Middle、NotSet或Top
Width:对象宽度
(4).例1 DataList控件查询数据
<%@Import namespace="System.Data"%>
<%@Import namespace="System.Data.OleDb"%>
<script language="vb" runat="server">
sub bindlist(strsql as string,tablename as string)
dim conn as new oledbconnection()
dim cmd as new oledbcommand()
dim ds as new dataset()
conn.connectionstring="provider=microsoft.jet.oledb.4.0;data source="+server.mappath("cbw.mdb")
conn.open()
cmd.connection=conn
cmd.commandtext=strsql
dim objadpt as new oledbdataadapter(cmd)
objadpt.fill(ds,tablename)
studl.datasource=ds.tables(tablename).defaultview
studl.databind()
conn.close()
end sub
sub page_load(sender as object,e as eventargs)
if not ispostback then
dim sqlstr as string="select * from message"
dim tablename as string="message"
bindlist(sqlstr,tablename)
end if
end sub
sub pickstudent(sender as object,e as datalistcommandeventargs)
studl.selectedindex=e.item.itemindex
dim sqlstr as string="select id,name,tel,fax from message"
dim tablename as string="message"
bindlist(sqlstr,tablename)
end sub
</script>
<h1>留言表</h1>
<form runat="server">
<asp:datalist Runat="server" ID="studl" CellPadding="3" whidth=600 OnItemCommand="pickstudent" Border="2" BorderColor="blue" GridLines="horizontal">
<ItemTemplate>
<asp:LinkButton Runat="server" ID="mylink" text='<%# container.dataitem("id") %>'/>
</ItemTemplate>
<SelectedItemTemplate>
<b><%# container.dataitem("id") %></b>
<b><%# container.dataitem("name") %></b>
<b><%# container.dataitem("tel") %></b>
<b><%# container.dataitem("fax") %></b>
</SelectedItemTemplate>
</asp:datalist>
</form>
(5).例2 DataList控件可编辑查询数据
<%@Import namespace="System.Data"%>
<%@Import namespace="System.Data.OleDb"%>
<%@ Page Language="vb" Debug="true" %>
<script language="vb" runat="server">
sub bindlist()
dim conn as new oledbconnection()
dim cmd as new oledbcommand()
dim ds as new dataset()
conn.connectionstring="provider=microsoft.jet.oledb.4.0;data source="+server.mappath("cbw.mdb")
conn.open()
cmd.connection=conn
cmd.commandtext="select id,name,tel,fax from message"
dim objadpt as new oledbdataadapter(cmd)
objadpt.fill(ds,"message")
studl.datasource=ds.tables("message").defaultview
studl.databind()
conn.close()
end sub
sub page_load(sender as object,e as eventargs)
if not ispostback then
bindlist()
end if
end sub
sub datalist_editcommand(sender as object,e as datalistcommandeventargs)
studl.edititemindex=e.item.itemindex
bindlist()
end sub
sub datalist_cancelcommand(sender as object,e as datalistcommandeventargs)
studl.edititemindex=-1
bindlist()
end sub
sub executesql(strsql as string)
dim conn as new oledbconnection()
conn.connectionstring="provider=microsoft.jet.oledb.4.0;data source="+server.mappath("cbw.mdb")
conn.open()
dim cmd as new oledbcommand(strsql,conn)
cmd.executenonquery()
end sub
sub datalist_deletecommand(sender as object,e as datalistcommandeventargs)
dim strsql as string="delete from message where "+studl.datakeyfield+"="+Cstr(studl.datakeys(e.item.itemindex))
executesql(strsql)
studl.edititemindex=-1
bindlist()
end sub
sub datalist_updatecommand(sender as object,e as datalistcommandeventargs)
dim fax as string=ctype(e.item.findcontrol("fax"),textbox).text
dim strsql as string="update message set fax="+fax+" where "+studl.datakeyfield+"="+Cstr(studl.datakeys(e.item.itemindex))
executesql(strsql)
studl.edititemindex=-1
bindlist()
end sub
</script>
<h1>留言表</h1>
<form runat="server">
<asp:datalist Runat="server" ID="studl" CellPadding="3" width="600" HorizontalAlign="center" OnEditCommand="datalist_editcommand" onupdatecommand="datalist_updatecommand" OnDeleteCommand="datalist_deletecommand" OnCancelCommand="datalist_cancelcommand" DataKeyField="id" ExtractTemplateRows="true" border="2" BorderColor="blue" GridLines="Horizontal">
<HeaderTemplate>
<asp:Table Runat="server" width="600">
<asp:TableRow Runat="server">
<asp:TableCell Runat="server" Width="50">ID</asp:TableCell>
<asp:TableCell Runat="server" Width="100">NAME</asp:TableCell>
<asp:TableCell Runat="server" Width="100">TEL</asp:TableCell>
<asp:TableCell Runat="server" Width="100">FAX</asp:TableCell>
<asp:TableCell Runat="server" Width="250">功能</asp:TableCell>
</asp:TableRow>
</asp:Table>
</HeaderTemplate>
<ItemTemplate>
<asp:Table Runat="server" Width="600">
<asp:TableRow Runat="server" HorizontalAlign="Center">
<asp:TableCell Runat="server"><%# container.dataitem("id") %></asp:TableCell>
<asp:TableCell Runat="server"><%# container.dataitem("name") %></asp:TableCell>
<asp:TableCell Runat="server"><%# container.dataitem("tel") %></asp:TableCell>
<asp:TableCell Runat="server"><%# container.dataitem("fax") %></asp:TableCell>
<asp:TableCell Runat="server"><asp:LinkButton Runat="server" text="编辑" Commandname="edit"/></asp:TableCell>
</asp:TableRow>
</asp:Table>
</ItemTemplate>
<EditItemTemplate>
<asp:Table Runat="server" Width="600">
<asp:TableRow Runat="server" HorizontalAlign="Center">
<asp:TableCell Runat="server"><%# container.dataitem("id")%></asp:TableCell>
<asp:TableCell Runat="server"><%# container.dataitem("name") %></asp:TableCell>
<asp:TableCell Runat="server"><%# container.dataitem("tel") %></asp:TableCell>
<asp:TableCell Runat="server"><asp:TextBox Runat="server" ID="fax" Width="100" Text='<%#container.dataitem("fax")%>'/></asp:TableCell>
<asp:TableCell Runat="server">
<asp:LinkButton Runat="server" Width="40" text="更新" CommandName="update"/>
<asp:LinkButton Runat="server" Width="40" text="删除" CommandName="delete"/>
<asp:LinkButton Runat="server" Width="40" text="取消" CommandName="cancel"/>
</asp:TableCell>
</asp:TableRow>
</asp:Table>
</EditItemTemplate>
<HeaderStyle HorizontalAlign="center" BackColor="#66ccff" ForeColor="red"/>
<ItemStyle BackColor="#eeeeee"/>
</asp:datalist>
</form>
3.DataGrid控件
(1).DataGrid控件所支持的模板
模板
|
说明
|
HeaderTemplate
|
设置数据标题的模板,该模板内的数据只出现一次
|
ItemTemplate
|
设置数据显示方式的模板,这是必需的模板
|
EditItemTemplate
|
编辑数据模板
|
FooterTemplate
|
设置数据页脚显示格式的模板,该模板内的数据只出现一次
|
PagerTemplate
|
数据分页的模板
|
(2).DataGrid控件的常用属性
属性
|
说明
|
AllowPaging
|
是否分页
|
AllowSorting
|
是否数据排序
|
AutoGenerateColumns
|
是否自动产生数据源中每一字段数据
|
BackImageUrl
|
表格背景图形
|
CellPadding
|
储存格与表格边框的距离
|
CellSpacing
|
储存格和储存格边框的距离
|
Columns
|
控件所显示的字段数(只读)
|
CurrentPageIndex
|
数据页数(在程序中设定)
|
DataKeyField
|
主键字段
|
DataSource
|
数据源
|
EditItemIndex
|
被编辑的字段名称(-1表示放弃编辑)
|
GridLines
|
是否显示网络线(在RepeatLayout设为Table时有效)
|
HorizontalAlign
|
水平对齐方式
|
Items
|
DataListIem的集合对象
|
PageCount
|
总页数(只读)
|
PageSize
|
每页显示的记录数
|
SelecedItem
|
被选定的项目(Item)
|
SelectedIndex
|
选定列(以Selected样版样式显示)
|
ShowFooter
|
是否显示脚注
|
ShowHeader
|
是否显示表头
|
VirualItemCount
|
设定所要显示的记录笔数
|
(2).DataGrid控件支持的样式对象
样式对象
|
说明
|
AlternationItemStyle AlternatingItemStyle
|
每一个交替项目所要显示的样式
|
(3).DataGrid控件的常用事件
事件
|
说明
|
OnItemCommand
|
当用户单击DataGrid控件中的Button、ImageButton或LinkButton等按钮控件触发此事件。该事件的参数为DataListCommandEventArgs,可取值为:(1)CommandArgument:获取按钮控件指定的选择参数(2)CommandName:获取按钮控件指定的命令名(3)CommandSource:获取被单击的按钮对象(4)Item:获取按钮对象所在的数据行,返回DataGridItem对象
|
OnCancelCommand
|
当单击DataGrid控件的“取消”按钮时触发该事件,参数同上
|
OnEditCommnad
|
当单击DataGrid控件的“编辑”按钮时触发该事件,参数同上
|
OnDeleteCommand
|
当单击DataGrid控件的“删除”按钮时触发该事件,参数同上
|
OnUpdateCommand
|
当单击DataGrid控件的“更新”按钮时触发该事件,参数同上
|
OnPageIndexChanged
|
在不同的数据页被选取时触发
|
OnSortcommand
|
在选择要排序的字段时触发(属性AllowSorting为True时有效)
|
(4).指定列: AutoGenerateColumns=False (不需要显示所有列)
列类型
|
属性
|
说明
|
BoundColumn
|
DataField:要显示的字段
DataFormatString:显示字段数据的格式。值的形式为{A:Bxx}
FooterStyle-property:页脚的显示格式
FooterText:字段在DataGrid控件页脚中要显示的内容,可包含HTML标记
HeaderImageUrl:字段标题中要显示的图片的位置(绝对或相对地址)
HeaderStyle-property:字段标题的显示格式
HeaderText:标题中显示的文本
ItemStyle-property:字段数据的显示格式
ReadOnly:指定字段内容是否只读,为True是只读,为False可编辑。默认为False
SortExpression:当发生OnSortCommand事件时用于排序的字段或字符串
Visible:指定字段是否可见。默认为True。通过设置该属性,可以显示或隐藏列
|
该列用于指定要显示的字段,字段内容为文本数据。
|
ButtonColumn
|
FooterStyle-property:页脚的显示格式
FooterText:字段在DataGrid控件页脚中要显示的内容,可包含HTML标记
HeaderText:标题中显示的文本
HeaderImageUrl:字段标题中要显示的图片的位置(绝对或相对地址)
HeaderStyle-property:字段标题的显示格式
ItemStyle-property:字段数据的显示格式
SortExpression:当发生OnSortCommand事件时用于排序的字段或字符串
Visible:指定字段是否可见。默认为True。通过设置该属性,可以显示或隐藏列
ButtonTyle:命令按钮类型,可取值为ButtonColumnType.Linkbutton和ButtonColumnType.PushButton,默认为前者
CommandName:按钮的命令名,在事件发生时将成为参数的一部分
DataTextFormatString:按钮文字的显示格式,形式为{A:Bxx}
Text:按钮上显示的文字。若已设置了DataTextField属性,则应用DataTextField所指定的字段内容作为按钮上显示的文字
|
按钮列,DataGrid中每条数据记录的该列都包含命令按钮
|
EditcommandColumn
|
与BoundColum列相同属性外,还有以下:
ButtonType:含义与ButtonType列的该属性相同
CancelText:取消按钮上显示的文字
EditText:编辑按钮上显示的文字
UpdateText:更新按钮上显示的文字
|
该列为编辑命令列,包含Edit按钮,单击Edit按钮将触发onEditCommand事件。可以为该事件编写事件处理程序。进入编辑模式后,该列将显示Update和Cancel二个按钮。单击Update按钮将触发OnUpdateCommand事件,事件处理程序用于指定如何更新数据源;单击Cancel按钮将触发OnCancelCommand事件,事件处理程序用于指定离开编辑模式。
|
HyperLinkColumn
|
与ButtonColumn列相同属性外,还有以下:
DataNavigateUrlField:作为超链接目标地址的字段名
DataNavigateUrlFormatingString:超链接目标的格式
NavigateUrl:超链接的目标URL
Target:超链接的目标页面所显示的窗口
Text:超链接文字,若同时设置了DataTextField,则以DataTextField属性的设置为准
|
超链接列,每个记录的该列都是一个超链接
|
(5).例
例:1 DataGrid控件查询数据
<%@Import namespace="System.Data"%>
<%@Import namespace="System.Data.OleDb"%>
<script language="vb" runat="server">
sub Page_Load(Sender as Object,e As EventArgs)
if not ispostback then
dim conn as string="provider=microsoft.jet.oledb.4.0;data source="+server.mappath("cbw.mdb")
dim objadpt as new oledbdataadapter("select * from message",conn)
dim ds as new dataset()
objadpt.fill(ds,"message")
mydatagrid.datasource=ds
mydatagrid.databind()
end if
end sub
</script>
<form runat="server">
<asp:datagrid Runat="server" ID="mydatagrid" AutoGenerateColumns="true" horizontalaalign="center">
<HeaderStyle Font-size="small" Font-Bold="true" HorizontalAlign="center" ForeColor="#ffffcc" BackColor="#990000"/>
<ItemStyle Font-Size="X-Small" ForeColor="#330099"/>
</asp:datagrid>
</form>
例2.把DataReader对象绑定到DataGrid对象 同理也可以绑定到Repeater及DataList对象上
<%@Import namespace="System.Data"%>
<%@Import namespace="System.Data.OleDb"%>
<%@ Page Language="vb" Debug="true" %>
<script language="vb" runat="server">
sub Page_Load(Sender as Object,e As EventArgs)
if not ispostback then
dim conn as new oledbconnection()
dim cmd as new oledbcommand()
dim objreader as oledbdatareader
dim i as integer
conn.connectionstring="provider=microsoft.jet.oledb.4.0;data source="+server.mappath("cbw.mdb")
conn.open()
cmd.connection=conn
cmd.commandtext="select * from message"
objreader=cmd.ExecuteReader() ‘执行CommandText命令,并返回给objreader
mydatagrid.datasource=objreader ‘定义DataGrid对象的数据源
mydatagrid.databind() ‘绑定DataGrid对象的数据源
objreader.close()
conn.close()
end if
end sub
</script>
<form runat="server">
<asp:datagrid Runat="server" ID="mydatagrid" AutoGenerateColumns="true" horizontalaalign="center">
<HeaderStyle Font-size="small" Font-Bold="true" HorizontalAlign="center" ForeColor="#ffffcc" BackColor="#990000"/>
<ItemStyle Font-Size="X-Small" ForeColor="#330099"/>
</asp:datagrid>
</form>
4.例:
例1:使用SQL Server接口的SqlDataAdapter对象获取查询结果
<%@Import namespace=”System.Data”%>
<%@Import namespace=”System.Data.SQLclient”%>
<html>
<script language=”vb” runat=server>
Sub Page_Load(Source as Object,E as EventArgs)
Dim sqlcon as New sqlConnection(“server= SQL服务器名称;uid=用户名(sa);pwd=密码(空);database=数据库名称”)
Dim ds as New DataSet
Sqlcon.Open
Dim sqld as New SqlDataAdapter(“select * from 表名”,sqlcon)
Sqld.Fill(ds,”tabstudent”)
Dg.DataSource=ds.Tables(“tabstudent”).DefaultView
Dg.DataBind
Sqlcon.Close
Sqlcon=nothing
Labcontent.Text=labcontent.Text&”查找成功”
End Sub
</script>
<body>
<form runat=server>
<asp:datagrid id=dg runat=server/><br>
<asp:label id=labcontext runat=server/><br>
</form>
</body>
</html>