扫一扫
分享文章到微信
扫一扫
关注官方公众号
至顶头条
模板化的数据绑定控件为我们在页面上显示数据提供了根本的灵活性。你可能还记得ASP.NET v1.x中的几个模板化控件(例如DataList和Repeater控件)。ASP.NET 2.0仍然支持这些控件,但在模板中绑定数据的语法已经被简化和改善了。本文将讨论在数据绑定控件模板中绑定数据的多种方法。
数据绑定表达式
ASP.NET 2.0改善了模板中的数据绑定操作,把v1.x中的数据绑定语法DataBinder.Eval(Container.DataItem, fieldname)简化为Eval(fieldname)。Eval方法与DataBinder.Eval一样可以接受一个可选的格式化字符串参数。缩短的Eval语法与DataBinder.Eval的不同点在于,Eval会根据最近的容器对象(例如DataListItem)的DataItem属性来自动地解析字段,而DataBinder.Eval需要使用参数来指定容器。由于这个原因,Eval只能在数据绑定控件的模板中使用,而不能用于Page(页面)层。当然,ASP.NET 2.0页面中仍然支持DataBinder.Eval,你可以在不支持简化的Eval语法的环境中使用它。
下面的例子演示了如何使用新的简化的Eval数据绑定语法绑定到DataList数据项模板(ItemTemplate)中的Image、Label和HyperLink控件。
<asp:DataList ID="DataList1" RepeatColumns="5" Width="600" runat="server" DataSourceID="ObjectDataSource1"> <ItemTemplate> <asp:HyperLink ID="HyperLink1" runat="server" NavigateUrl='<%# Eval("PhotoID", "PhotoFormViewPlain.aspx?ID={0}") %>'> <asp:Image ID="Image1" Runat="server" ImageUrl='<%# Eval("FileName", "images/thumbs/{0}") %>' /></asp:HyperLink> <asp:Label ID="CaptionLabel" runat="server" Text='<%# Eval("Caption") %>' /> </ItemTemplate> </asp:DataList><br /> <asp:ObjectDataSource ID="ObjectDataSource1" runat="server" TypeName="DataComponentTableAdapters.PhotosTableAdapter" SelectMethod="GetPhotosForAlbum"> |
<asp:FormView ID="FormView1" runat="server" DataSourceID="ObjectDataSource1"> <ItemTemplate> <asp:Label ID="CaptionLabel" runat="server" Text='<%# Eval("Caption") %>' Font-Size="32pt" /><br /> <asp:Image ID="Image1" runat="server" ImageUrl='<%# Eval("FileName", "images/{0}") %>' /> <asp:HyperLink ID="HyperLink1" Text="Back to Album" NavigateUrl='<%# Eval("AlbumID", "PhotosDataList.aspx?ID={0}") %>' runat="server" /> </ItemTemplate> </asp:FormView> <asp:ObjectDataSource ID="ObjectDataSource1" runat="server" TypeName="DataComponentTableAdapters.PhotosTableAdapter" SelectMethod="GetPhoto"> <SelectParameters> <asp:QueryStringParameter Name="PhotoID" DefaultValue="9" QueryStringField="ID" /> </SelectParameters> </asp:ObjectDataSource> |
<asp:FormView ID="FormView1" Runat="server" DataSourceID="SqlDataSource1" HeaderText="Books for Author" AllowPaging="True"> <ItemTemplate> <asp:Image ID="Image1" ImageUrl='<%# Eval("title_id","~/Images/{0}.gif") %>' Runat="server" /> <asp:Label ID="Label1" Font-Size="1.2em" Font-Bold="true" Text='<%# Eval("title") %>' runat="server" /> <asp:Label ID="Label2" Text='<%# Eval("price","{0:c}") %>' runat="server" /> </ItemTemplate> </asp:FormView> <asp:SqlDataSource ID="SqlDataSource1" Runat="server" SelectCommand="SELECT dbo.authors.au_id, dbo.titles.title_id, dbo.titles.title, dbo.titles.type, dbo.titles.price, dbo.titles.notes FROM dbo.authors INNER JOIN dbo.titleauthor ON dbo.authors.au_id = dbo.titleauthor.au_id INNER JOIN dbo.titles ON dbo.titleauthor.title_id = dbo.titles.title_id WHERE (dbo.authors.au_id = @au_id)" ConnectionString="<%$ ConnectionStrings:Pubs %>"> <SelectParameters> <asp:QueryStringParameter Name="au_id" DefaultValue="213-46-8915" QueryStringField="ID" /> </SelectParameters> </asp:SqlDataSource> |
双向数据绑定
FormView可以通过相关的数据源控件支持自动地更新、插入和删除操作(与DetailsView类似)。如果要定义编辑或插入的UI,那么除了定义数据项模板(ItemTemplate)之外,你还要定义EditItemTemplate或InsertItemTemplate模板。在这个模板中,你可以把输入控件(例如文本框、检查框或下拉列表)绑定到数据源的字段。这些模板中的数据绑定使用了"双向"数据绑定语法,允许FormView从模板的输入控件中提取值并传递给数据源。这些数据绑定操作用新的Bind(fieldname)语法代替了Eval。
请注意:使用Bind语法的数据绑定控件必须设置好ID属性。
GridView或DetailsView执行更新或插入操作的时候(这些控件的Columns或Fields都会定义BoundFields,绑定字段),GridView或 DetailsView负责建立编辑或插入模式中的输入UI,因此它能够自动地提取这些值并把它们传递给数据源。由于模板包含了任意的用户自定义UI控件,双向数据绑定语法就是必要的,以确保模板化控件(例如FormView)在应对更新、插入或删除操作的时候,知道应该从模板中提取那些控件的值。你仍然可以在EditItemTemplate中使用Eval语句进行数据绑定,来给数据源传递值。请注意,FormView与DetailsView和GridView一样支持DataKeyNames属性,它保存了传递给更新/删除操作的主键字典的原始值,即使这些值没有显示出来。
FormView支持DefaultMode属性,它可以指定默认显示的模板,但在默认情况下FormView处于只读模式并显示ItemTemplate模板。为了把UI从只读模式转换为编辑或插入模式,你可以给模板添加一个按钮控件,把该按钮的CommandName属性设置为Edit或New。在EditItemTemplate模板中,你可以增加按钮,把CommandName设置为Update或Cancel以提交或终止更新操作。类似的,你可以增加按钮,把CommandName设置为Insert或Cancel来提交或终止插入操作。
下面的例子演示了定义了ItemTemplate和EditItemTemplate模板的FormView。其中的ItemTemplate模板包含了使用Eval(双向)绑定的控件,而EditItemTemplate模板则包含了使用Bind语句进行双向绑定的文本框控件。主键字段(PhotoID)是使用DataKeyNames属性存放在viewstate中的。该FormView包含了用于在模板之间进行切换的按钮。
<asp:FormView ID="FormView1" runat="server" DataSourceID="ObjectDataSource1" DataKeyNames="PhotoID"> <EditItemTemplate> <b>Enter a New Caption:</b> <asp:TextBox Text='<%# Bind("Caption") %>' runat="server" ID="CaptionTextBox" /> <asp:Button ID="Button1" runat="server" Text="Update" CommandName="Update" /> <asp:Button ID="Button2" runat="server" Text="Cancel" CommandName="Cancel" /> </EditItemTemplate> <ItemTemplate> <asp:Label ID="CaptionLabel" runat="server" Text='<%# Eval("Caption") %>' Font-Size="32pt" /><br /> <asp:Image ID="Image1" runat="server" ImageUrl='<%# Eval("FileName", "images/{0}") %>' /> <br /> <asp:Button ID="Button3" runat="server" Text="Edit Caption..." CommandName="Edit" /> <asp:HyperLink ID="HyperLink1" Text="Back to Album" NavigateUrl='<%# Eval("AlbumID", "PhotosDataList.aspx?ID={0}") %>' runat="server" /> </ItemTemplate> </asp:FormView> <asp:ObjectDataSource ID="ObjectDataSource1" runat="server" TypeName="DataComponentTableAdapters.PhotosTableAdapter" SelectMethod="GetPhoto" UpdateMethod="UpdateCaption" OldValuesParameterFormatString="original_{0}"> <UpdateParameters> <asp:Parameter Name="Caption" /> <asp:Parameter Name="Original_PhotoID" /> </UpdateParameters> <SelectParameters> <asp:QueryStringParameter Name="PhotoID" DefaultValue="9" QueryStringField="ID" /> </SelectParameters> </asp:ObjectDataSource> |
…… <asp:GridView ID="GridView1" runat="server" DataSourceID="ObjectDataSource1" AutoGenerateColumns="False" AllowPaging="True" AllowSorting="True" DataKeyNames="AlbumID"> <Columns> <asp:CommandField ShowEditButton="True" /> <asp:BoundField ReadOnly="True" HeaderText="AlbumID" DataField="AlbumID" SortExpression="AlbumID" /> <asp:TemplateField HeaderText="AlbumName" SortExpression="AlbumName" ItemStyle-Wrap="false"> <ItemTemplate> <asp:Label ID="Label1" runat="server" Text='<%# Eval("AlbumName") %>'></asp:Label> </ItemTemplate> <EditItemTemplate> <asp:TextBox ID="TextBox1" runat="server" Text='<%# Bind("AlbumName") %>'></asp:TextBox> <asp:RequiredFieldValidator ControlToValidate="TextBox1" ErrorMessage="AlbumName cannot be empty" ID="RequiredFieldValidator1" Display="Dynamic" runat="server">*</asp:RequiredFieldValidator> </EditItemTemplate> </asp:TemplateField> …… </asp:GridView><br /> <asp:ValidationSummary ID="ValidationSummary1" runat="server" /> <asp:ObjectDataSource ID="ObjectDataSource1" runat="server" ConvertNullToDBNull="true" TypeName="DataComponentTableAdapters.AlbumsTableAdapter" SelectMethod="GetAlbumsByOwner" UpdateMethod="Update" OldValuesParameterFormatString="original_{0}"> …… </asp:ObjectDataSource> |
<asp:TemplateField HeaderText="Owner" SortExpression="Owner"> <ItemTemplate> <asp:Label ID="Label2" runat="server" Text='<%# Eval("Owner") %>'></asp:Label> </ItemTemplate> <EditItemTemplate> <asp:DropDownList DataSourceID="ObjectDataSource2" DataTextField="Owner" DataValueField="Owner" ID="DropDownList2" runat="server" SelectedValue='<%# Bind("Owner") %>'> </asp:DropDownList> </EditItemTemplate> <ItemStyle Wrap="False" /> </asp:TemplateField> |
如果您非常迫切的想了解IT领域最新产品与技术信息,那么订阅至顶网技术邮件将是您的最佳途径之一。
现场直击|2021世界人工智能大会
直击5G创新地带,就在2021MWC上海
5G已至 转型当时——服务提供商如何把握转型的绝佳时机
寻找自己的Flag
华为开发者大会2020(Cloud)- 科技行者