detailview的控件基础
2008-04-10 17:43
309 查看
DetailsView 控件指定数据源控件,就可以使用单条方式显示记录数据,不仅如此,它同样可以使用分页来显示,如下所示。
<asp:AccessDataSource Id="Products" Runat="server"
DataFile="~/Products.mdb"
SelectCommand="SELECT ProductNo,ProductName, ProductPrice,InStock FROM Products"/>
<asp:DetailsView Id="detail" Runat="server"
DataSourceID="Products"
HeaderText="图书信息"
HeaderStyle-BackColor="#CC99FF"
AllowPaging="True"
PagerSettings-Position="Bottom"
RowStyle-VerticalAlign="Top"/>
上述DetailsView控件指定数据源控件Products,因为AutoGenerateColumns属性默认值为True,所以能够自动产生Field控件的字段,AllowPaging属性为 Ture,表示分页显示。完整ASP.NET程序范例是Ch10-5-1.aspx,其执行结果如图10-13所示。
[align=center]图10-13 Ch10-5-1.aspx运行结果[/align]
10.5.2 DetailsView控件的Field控件
DetailsView 控件也支持 GridView 的 Field 控件,可以自行定义字段类型,如下所示。
<asp:DetailsView Id="detail" Runat="server"
DataSourceID="Products" Width="350px"
AutoGenerateRows="False"
……….
RowStyle-VerticalAlign="Top">
<Fields>
<asp:BoundField ………/>
………
<asp:CheckBoxField …….../>
<asp:ImageField ………/>
</Fields>
</asp:DetailsView>
上述 DatailsView 控件的 AutoGenerateRows 属性为 False,所以需要使用 Field 控件来定义显示字段,这些控件位于在 <Fields>标记。
1. ASP.NET 程序:Ch10-5-2.aspx
在 ASP.NET程序中使用 DetailsView 控件的 Field 控件,以单条方式显示数据表的记录数据,如下所示。
01: <html>
02: <head><title>Ch10-5-2</title></head>
03: <body>
04: <form Runat="server">
05: <asp:AccessDataSource Id="Products" Runat="server"
06: DataFile="~/Products.mdb"
07: SelectCommand="SELECT * FROM Products"/>
08: <asp:DetailsView Id="detail" Runat="server"
09: DataSourceID="Products" Width="350px"
10: AutoGenerateRows="False"
11: HeaderText="图书信息"
12: HeaderStyle-BackColor="#CC99FF"
13: HeaderStyle-HorizontalAlign="Center"
14: AllowPaging="True"
15: PagerSettings-Position="Bottom"
16: RowStyle-VerticalAlign="Top">
17: <Fields>
18: <asp:BoundField HeaderText="书号"
19: DataField="ProductNo" ReadOnly="True"
20: HeaderStyle-BackColor="#E0E0E0"
21: HeaderStyle-Font-Bold="True"/>
22: <asp:BoundField HeaderText="书名"
23: DataField="ProductName" NullDisplayText="没有书名"
24: HeaderStyle-BackColor="#E0E0E0"
25: HeaderStyle-Font-Bold="True"/>
26: <asp:BoundField HeaderText="书价" HtmlEncode="False"
27: DataField="ProductPrice" DataFormatString="{0:C}"
28: HeaderStyle-BackColor="#E0E0E0"
29: HeaderStyle-Font-Bold="True"/>
30: <asp:CheckBoxField HeaderText="库存" DataField="InStock"
31: HeaderStyle-BackColor="#E0E0E0"
32: HeaderStyle-Font-Bold="True"/>
33: <asp:ImageField HeaderText="封面"
34: DataImageUrlField="ProductNo"
35: DataImageUrlFormatString="~/{0}.jpg"
36: HeaderStyle-BackColor="#E0E0E0"
37: HeaderStyle-Font-Bold="True"/>
38: </Fields>
39: </asp:DetailsView>
40: </form>
41: </body>
42: </html>
2. 程序说明
第8~39行是DetailsView控件,AutoGenerateColumns属性值False,表示需要使用Field控件定义字段,这是位于在第17~38行的<Fields>标记,包含ButtonField、CheckBoxField 和 ImageField 控件。
3. 网页预览
将Ch10文件夹建立为虚拟目录后,启动浏览程序执行 ASP.NET 程序,可以看到 DetailsView 控件显示的单条记录数据,如图10-14所示。
[align=center]图10-14 Ch10-5-2.aspx运行结果[/align]
10.5.3 DetailsView控件的编辑功能
DetailsView 控件提供数据表记录的编辑功能,不仅可以更新和删除记录,还可以在数据表中插入新记录。
1. DetailsView控件的基本编辑功能
DetailsView 控件的编辑功能可以自动建立,只需在数据源控件中建立所需的 SQL 命令,如下所示。
<asp:AccessDataSource Id="Products" Runat="server"
DataFile="~/Products.mdb"
SelectCommand="SELECT ProductNo,ProductName,
ProductPrice,InStock FROM Products"
UpdateCommand="UPDATE Products SET
ProductName=@ProductName,
ProductPrice=@ProductPrice,
InStock=@InStock
WHERE ProductNo=@ProductNo"
DeleteCommand="DELETE From Products
WHERE ProductNo=@ProductNo"
InsertCommand="INSERT INTO Products(ProductNo, ProductName,ProductPrice,Instock)
VALUES(@ProductNo,@ProductName, @ProductPrice,@Instock)"/>
上述 UpdateCommand、DeleteCommand 和 InsertCommand 属性分别指定更新、删除和插入记录的 SQL 命令,@ 开头是对应字段名称的参数。
现在只需在 DetailsView 控件中打开编辑功能,就可以使用上述 SQL 命令来编辑数据表的记录数据,如下所示。
<asp:DetailsView Id="detail" Runat="server"
DataSourceID="Products" Width="300pt"
………
AutoGenerateEditButton="True"
AutoGenerateDeleteButton="True"
AutoGenerateInsertButton="True"
DataKeyNames="ProductNo"/>
上述 AutoGenerate…Button 属性依次创建编辑、删除和新建的超级链接,最后的 DataKeyNames 属性指定主键为 ProductNo。完整 ASP.NET 程序范例是 Ch10-5-3Auto.aspx,可以在表格中添加编辑行,如图10-15所示。
[align=center]图10-15 Ch10-5-3Auto.aspx运行结果[/align]
2. CommandField控件
CommandField 控件可以在 DetailsView 控件建立所需样式的编辑行,只需将 AutoGenerate…Button 属性设为 False,就可以在 <Fields> 标记的字段区创建 CommandField 控件,如下所示。
<asp:CommandField
ButtonType="Button"
HeaderText="编辑"
HeaderStyle-BackColor="#E0E0E0"
HeaderStyle-Font-Bold="True"
ItemStyle-BackColor="#E0E0E0"
ShowHeader="True"
ShowInsertButton="True"
ShowEditButton="True"
ShowDeleteButton="True"/>
上述标记指定编辑行字段名称、样式和是否显示各编辑按钮。完整 ASP.NET 程序范例是 Ch10-5-3Command.aspx,可以在表格中创建自订样式的编辑行,如图10-16所示。
[align=center]图10-16 Ch10-5-3Command.aspx运行结果[/align]
3. TemplateFiled控件
DetailsView 控件同样可以使用 TemplateField 控件来自订所需的数据输入字段,其使用方式和 GridView 控件相似,唯一差异是多了一个 Insert 按钮,如下所示。
<asp:TemplateField HeaderText="编辑">
<ItemTemplate>
<asp:Button Text="创建" CommandName="New"
Runat="server"/>
………
</ItemTemplate>
<EditItemTemplate>…</EditItemTemplate>
<InsertItemTemplate>
<asp:Button Text="插入" CommandName="Insert"
Runat="server"/>
<asp:Button Text="取消" CommandName="Cancel"
Runat="server"/>
</InsertItemTemplate>
</asp:TemplateField>
在上述 <ItemTemplate> 标记创建 CommandName 属性为 New 的 Button 控件,然后创建 <InsertItemTemplate> 标记的 Insert 和 Cancel 按钮。完整 ASP.NET 程序范例是 Ch10-5-3.aspx,其执行结果如图10-17所示。
[align=center]图10-17 Ch10-5-3.aspx运行结果[/align]
4. 编辑事件与事件处理
DetailsView 控件的编辑事件与事件处理参数对象如表10-22所示。
[align=center]表10-22 DetailsView 控件的编辑事件与事件处理参数对象[/align]
例如,ItemUpdating 事件处理程序可以进行数据验证,如下所示。
Sub validateData(Sender As Object, _
E As DetailsViewUpdateEventArgs)
If Not IsNumeric(E.NewValues("ProductPrice"))Then
E.Cancel = True
show.Text="书价需为数值........"
End If
End Sub
上述程序可以检查 NewValues 属性获取的新输入值是否为数值。完整 ASP.NET 程序范例是 Ch10-5-3Event.aspx。
<asp:AccessDataSource Id="Products" Runat="server"
DataFile="~/Products.mdb"
SelectCommand="SELECT ProductNo,ProductName, ProductPrice,InStock FROM Products"/>
<asp:DetailsView Id="detail" Runat="server"
DataSourceID="Products"
HeaderText="图书信息"
HeaderStyle-BackColor="#CC99FF"
AllowPaging="True"
PagerSettings-Position="Bottom"
RowStyle-VerticalAlign="Top"/>
上述DetailsView控件指定数据源控件Products,因为AutoGenerateColumns属性默认值为True,所以能够自动产生Field控件的字段,AllowPaging属性为 Ture,表示分页显示。完整ASP.NET程序范例是Ch10-5-1.aspx,其执行结果如图10-13所示。
[align=center]图10-13 Ch10-5-1.aspx运行结果[/align]
10.5.2 DetailsView控件的Field控件
DetailsView 控件也支持 GridView 的 Field 控件,可以自行定义字段类型,如下所示。
<asp:DetailsView Id="detail" Runat="server"
DataSourceID="Products" Width="350px"
AutoGenerateRows="False"
……….
RowStyle-VerticalAlign="Top">
<Fields>
<asp:BoundField ………/>
………
<asp:CheckBoxField …….../>
<asp:ImageField ………/>
</Fields>
</asp:DetailsView>
上述 DatailsView 控件的 AutoGenerateRows 属性为 False,所以需要使用 Field 控件来定义显示字段,这些控件位于在 <Fields>标记。
1. ASP.NET 程序:Ch10-5-2.aspx
在 ASP.NET程序中使用 DetailsView 控件的 Field 控件,以单条方式显示数据表的记录数据,如下所示。
01: <html>
02: <head><title>Ch10-5-2</title></head>
03: <body>
04: <form Runat="server">
05: <asp:AccessDataSource Id="Products" Runat="server"
06: DataFile="~/Products.mdb"
07: SelectCommand="SELECT * FROM Products"/>
08: <asp:DetailsView Id="detail" Runat="server"
09: DataSourceID="Products" Width="350px"
10: AutoGenerateRows="False"
11: HeaderText="图书信息"
12: HeaderStyle-BackColor="#CC99FF"
13: HeaderStyle-HorizontalAlign="Center"
14: AllowPaging="True"
15: PagerSettings-Position="Bottom"
16: RowStyle-VerticalAlign="Top">
17: <Fields>
18: <asp:BoundField HeaderText="书号"
19: DataField="ProductNo" ReadOnly="True"
20: HeaderStyle-BackColor="#E0E0E0"
21: HeaderStyle-Font-Bold="True"/>
22: <asp:BoundField HeaderText="书名"
23: DataField="ProductName" NullDisplayText="没有书名"
24: HeaderStyle-BackColor="#E0E0E0"
25: HeaderStyle-Font-Bold="True"/>
26: <asp:BoundField HeaderText="书价" HtmlEncode="False"
27: DataField="ProductPrice" DataFormatString="{0:C}"
28: HeaderStyle-BackColor="#E0E0E0"
29: HeaderStyle-Font-Bold="True"/>
30: <asp:CheckBoxField HeaderText="库存" DataField="InStock"
31: HeaderStyle-BackColor="#E0E0E0"
32: HeaderStyle-Font-Bold="True"/>
33: <asp:ImageField HeaderText="封面"
34: DataImageUrlField="ProductNo"
35: DataImageUrlFormatString="~/{0}.jpg"
36: HeaderStyle-BackColor="#E0E0E0"
37: HeaderStyle-Font-Bold="True"/>
38: </Fields>
39: </asp:DetailsView>
40: </form>
41: </body>
42: </html>
2. 程序说明
第8~39行是DetailsView控件,AutoGenerateColumns属性值False,表示需要使用Field控件定义字段,这是位于在第17~38行的<Fields>标记,包含ButtonField、CheckBoxField 和 ImageField 控件。
3. 网页预览
将Ch10文件夹建立为虚拟目录后,启动浏览程序执行 ASP.NET 程序,可以看到 DetailsView 控件显示的单条记录数据,如图10-14所示。
[align=center]图10-14 Ch10-5-2.aspx运行结果[/align]
10.5.3 DetailsView控件的编辑功能
DetailsView 控件提供数据表记录的编辑功能,不仅可以更新和删除记录,还可以在数据表中插入新记录。
1. DetailsView控件的基本编辑功能
DetailsView 控件的编辑功能可以自动建立,只需在数据源控件中建立所需的 SQL 命令,如下所示。
<asp:AccessDataSource Id="Products" Runat="server"
DataFile="~/Products.mdb"
SelectCommand="SELECT ProductNo,ProductName,
ProductPrice,InStock FROM Products"
UpdateCommand="UPDATE Products SET
ProductName=@ProductName,
ProductPrice=@ProductPrice,
InStock=@InStock
WHERE ProductNo=@ProductNo"
DeleteCommand="DELETE From Products
WHERE ProductNo=@ProductNo"
InsertCommand="INSERT INTO Products(ProductNo, ProductName,ProductPrice,Instock)
VALUES(@ProductNo,@ProductName, @ProductPrice,@Instock)"/>
上述 UpdateCommand、DeleteCommand 和 InsertCommand 属性分别指定更新、删除和插入记录的 SQL 命令,@ 开头是对应字段名称的参数。
现在只需在 DetailsView 控件中打开编辑功能,就可以使用上述 SQL 命令来编辑数据表的记录数据,如下所示。
<asp:DetailsView Id="detail" Runat="server"
DataSourceID="Products" Width="300pt"
………
AutoGenerateEditButton="True"
AutoGenerateDeleteButton="True"
AutoGenerateInsertButton="True"
DataKeyNames="ProductNo"/>
上述 AutoGenerate…Button 属性依次创建编辑、删除和新建的超级链接,最后的 DataKeyNames 属性指定主键为 ProductNo。完整 ASP.NET 程序范例是 Ch10-5-3Auto.aspx,可以在表格中添加编辑行,如图10-15所示。
[align=center]图10-15 Ch10-5-3Auto.aspx运行结果[/align]
2. CommandField控件
CommandField 控件可以在 DetailsView 控件建立所需样式的编辑行,只需将 AutoGenerate…Button 属性设为 False,就可以在 <Fields> 标记的字段区创建 CommandField 控件,如下所示。
<asp:CommandField
ButtonType="Button"
HeaderText="编辑"
HeaderStyle-BackColor="#E0E0E0"
HeaderStyle-Font-Bold="True"
ItemStyle-BackColor="#E0E0E0"
ShowHeader="True"
ShowInsertButton="True"
ShowEditButton="True"
ShowDeleteButton="True"/>
上述标记指定编辑行字段名称、样式和是否显示各编辑按钮。完整 ASP.NET 程序范例是 Ch10-5-3Command.aspx,可以在表格中创建自订样式的编辑行,如图10-16所示。
[align=center]图10-16 Ch10-5-3Command.aspx运行结果[/align]
3. TemplateFiled控件
DetailsView 控件同样可以使用 TemplateField 控件来自订所需的数据输入字段,其使用方式和 GridView 控件相似,唯一差异是多了一个 Insert 按钮,如下所示。
<asp:TemplateField HeaderText="编辑">
<ItemTemplate>
<asp:Button Text="创建" CommandName="New"
Runat="server"/>
………
</ItemTemplate>
<EditItemTemplate>…</EditItemTemplate>
<InsertItemTemplate>
<asp:Button Text="插入" CommandName="Insert"
Runat="server"/>
<asp:Button Text="取消" CommandName="Cancel"
Runat="server"/>
</InsertItemTemplate>
</asp:TemplateField>
在上述 <ItemTemplate> 标记创建 CommandName 属性为 New 的 Button 控件,然后创建 <InsertItemTemplate> 标记的 Insert 和 Cancel 按钮。完整 ASP.NET 程序范例是 Ch10-5-3.aspx,其执行结果如图10-17所示。
[align=center]图10-17 Ch10-5-3.aspx运行结果[/align]
4. 编辑事件与事件处理
DetailsView 控件的编辑事件与事件处理参数对象如表10-22所示。
[align=center]表10-22 DetailsView 控件的编辑事件与事件处理参数对象[/align]
事 件 | 程序参数对象 | 说 明 |
ItemInserting | DetailsViewInsertEventArgs | 插入但未写入数据源 |
ItemInserted | DetailsViewInsertedEventArgs | 插入且写入数据源 |
ItemUpdating | DetailsViewUpdateEventArgs | 更新但未写入数据源 |
ItemUpdated | DetailsViewUpdatedEventArgs | 更新且写入数据源 |
ItemDeleting | DetailsViewDeleteEventArgs | 删除但未写入数据源 |
ItemDeleted | DetailsViewDeletedEventArgs | 删除且写入数据源 |
Sub validateData(Sender As Object, _
E As DetailsViewUpdateEventArgs)
If Not IsNumeric(E.NewValues("ProductPrice"))Then
E.Cancel = True
show.Text="书价需为数值........"
End If
End Sub
上述程序可以检查 NewValues 属性获取的新输入值是否为数值。完整 ASP.NET 程序范例是 Ch10-5-3Event.aspx。
相关文章推荐
- Asp.net中Detailview的控件问题
- UI基础----常见控件的使用之TextView
- Android基础控件——ViewPager实现带有动画的引导页
- [iOS基础控件 - 3.5] NSBundle, UIImageView和UIButton的区别, 模拟器和文档
- android 基础控件(EditView、SeekBar等)的属性及使用方法
- UI基础第十三弹: UIScrollView控件图片缩放
- Android基础控件——RecyclerView实现混排效果,仿网易云音乐
- 基础控件------TextView控件2(长文本滚动播放)
- 【android基础学习之四】——基础控件CheckBox,Spinner,AutoCompleteTextView,DatePicker,TimePicker
- Android React-Native系列之<二>零基础学习React-Native控件之View
- 【android基础学习之五】——基础控件Menu,Dialog,ImageView,ImageButton
- Gridview 控件与detailview控件合用实现插入功能
- Android 基础控件之AutoCompleteTextView
- Android 基础教程--TextView控件
- 0911Android基础网络技术之WebView控件
- 《iOS开发笔记—基础控件UIButton/UILable/UIImageView》
- [iOS基础控件 - 6.5] UITableView的数据刷新
- 基础控件之UILabel、UIButton、UITextField、UIAlertView、 UIImageView
- iOS基础控件:UIScrollView 之三大属性 contentOffset 、contentSize 、contentInset 之间的区别
- iOS开发-UI控件:UICollectionView基础