利用TemplateField将姓和名显示在一列中

开发 后端
本文介绍了利用TemplateField将姓和名显示在一列中的方法。

现在,每一个雇员的姓和名都是分开在两列中显示的。把它们放到一个列中显示出来也许是一个不错的主意。要做到这一点,我们需要用到TemplateField。我们可以添加一个新的TemplateField,给它加上一些必须的标记语言和数据绑定代码,然后删除原来的FirstName和 LastName这两个BoundField;当然,我们也可以将FirstName这个BoundField直接转换成一个TemplateField,编辑它以加上LastName的值,然后再删除LastName这个BoundField。 

两种办法都行,不过我个人还是比较喜欢直接转换的那种,因为这种方式可以自动的添加一个含有Web控件和相应的数据绑定代码的ItemTemplate和EditItemTemplate,它们可以用来模仿一个BoundField的呈现和功能。这样做的好处自然是不言而喻的,因为转换的过程已经帮我们做了很多事情,那我们当然就可以节约不少的时间了。 

要将一个BoundField转换成TemplateField,我们可以在GridView的智能标签的弹出菜单中点击“编辑列”(Edit Columns)。在弹出对话框的左下角的列表中选择需要转换的BoundField,然后点击右下角的“将此列转换成模板列”(Convert this field into a TemplateField)即可。

在字段对话框中,将一个绑定列转换成一个模板列 

TemplateField:在字段对话框中,将一个绑定列转换成一个模板列

让我们继续将FirstName这个BoundField转换成TemplateField。在这个更改之后,设计器中并没有什么明显的不同。这是因为将BoundField转换成TemplateField时,其实是创建了一个维持之前的BoundField的外观和感觉的TemplateField。尽管在设计器中没有视觉上的变化,但是这个转换的过程已经将BoundField的声明代码——< asp:BoundField DataField="FirstName" HeaderText="FirstName" SortExpression="FirstName" />——改成了如下所示的TemplateField的声明代码: 

  1. < asp:TemplateField HeaderText="FirstName" SortExpression="FirstName">  
  2.     < EditItemTemplate>  
  3.         < asp:TextBox ID="TextBox1" runat="server" Text='< %# Bind("FirstName") %>'>< /asp:TextBox>  
  4.     < /EditItemTemplate>  
  5.     < ItemTemplate>  
  6.         < asp:Label ID="Label1" runat="server" Text='< %# Bind("FirstName") %>'>< /asp:Label>  
  7.     < /ItemTemplate>  
  8. < /asp:TemplateField> 

就像你看到的那样,TemplateField由两个模板组成——一个ItemTemplate,它有一个Label控件,其Text属性被设置为FirstName数据字段的值;还有一个EditItemTemplate,它有一个TextBix控件,其Text属性也被设置为FirstName数据字段的值。数据绑定语法——

< %# Bind("fieldName") %>——说明数据字段fieldName 被绑定到了这个特定的Web控件的属性上。

要将LastName添加到TemplateField中,我们需要为ItemTemplate添加一个Label控件并将其Text属性绑定到LastName上。通过设计器或是手工编写代码都可以做到这一点。要手工写代码的话,只需简单的将相应的声明代码添加到ItemTemplate中即可,如下所示:

  1. < asp:TemplateField HeaderText="FirstName" SortExpression="FirstName">  
  2.     < EditItemTemplate>  
  3.         < asp:TextBox ID="TextBox1" runat="server" Text='< %# Bind("FirstName") %>'>< /asp:TextBox>  
  4.      < /EditItemTemplate>  
  5.      < ItemTemplate>  
  6.          < asp:Label ID="Label1" runat="server" Text='< %# Bind("FirstName") %>'>< /asp:Label>  
  7.          < asp:Label ID="Label2" runat="server" Text='< %# Bind("LastName") %>'>< /asp:Label>  
  8.      < /ItemTemplate>  
  9.  < /asp:TemplateField> 

要通过设计器来添加的话,还是在GridView的智能标签的弹出菜单中点击“编辑列”( Edit Templates)。这样会显示GridView的模板编辑界面。在这个界面中,智能标签是GridView中模板的列表。因为这个时候我们只有一个TemplateField,所以下拉列表中只有FirstName的各种模板和EmptyDataTemplate以及PagerTemplate。如果指定了EmptyDataTemplate模板的话,它将用于绑定到GridView的数据源中没有任何记录时的输出呈现;如果指定了PagerTemplate,它将用于呈现GridView的分页界面。

GridView的模板列可以通过设计器来编辑 

TemplateField:GridView的模板列可以通过设计器来编辑

要在FirstName模板列中同时显示LastName,从工具箱中拖一个Label到FirstName模板列的ItemTemplate中即可,当然,这要在GridView的模板编辑界面中才行的,如下图所示:

向FirstName模板列的ItemTemplate中添加一个Label 

TemplateField:向FirstName模板列的ItemTemplate中添加一个Label

现在,添加到TemplateField的Label控件的Text属性还是“Label”。我们需要修改这个以使这个属性绑定到数据源中的LastName字段上。我们可以通过在Label控件的智能标记上点击一下,然后在弹出菜单中选择“编辑数据绑定”( Edit DataBindings)选项,如下图所示:

从Label的智能标签上选择Edit DataBindings选项 

TemplateField:从Label的智能标签上选择Edit DataBindings选项

在弹出的数据绑定对话框中,你可以在左边的列表中选择需要绑定的属性,然后在右边的下来框中选择一个数据字段。好了,我们现在在左边选择Text属性,然后在右边选择LastName字段,点击OK。

将Text属性绑定到LastName字段上 

TemplateField:将Text属性绑定到LastName字段上

注意:数据绑定对话框允许你声明一个双向的数据绑定。如果你保持“双向数据绑定” (Two-way databinding)这个复选框为未选中的话,数据绑定的代码将会是< %# Eval("LastName")%>而不是< %# Bind("LastName")%>。不过,对于本节教程来说,两个种做法的效果都是OK的。双向数据绑定在插入和编辑数据的时候将会比较重要。但是如果仅仅是简单的显示数据的话,两种做法都是一样的。我们将在今后的章节中详细的讨论一下双向数据绑定。

让我们再花一些时间到浏览器中看看这个页面。就像你看到的那样,GridView仍然包含4列,不过,FirstName列里面显示了姓和名两个数据。

姓和名显示在同一列里面了 

TemplateField:姓和名显示在同一列里面了

要完成这一步,我们先删除LastName这个绑定列,并将FirstName这个模板列的列头文本(HeaderText)改成“Name”。在这之后,GridView的声明代码将会像下面这样:

 

  1. < asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False"   
  2. DataKeyNames="EmployeeID" 
  3.      DataSourceID="ObjectDataSource1">  
  4.      < Columns>  
  5.          < asp:TemplateField HeaderText="Name" SortExpression="FirstName">  
  6.              < EditItemTemplate>  
  7.                  < asp:TextBox ID="TextBox1" runat="server" Text='< %# Bind("FirstName") %>'>  
  8. < /asp:TextBox>  
  9.              < /EditItemTemplate>  
  10.              < ItemTemplate>  
  11.                  < asp:Label ID="Label1" runat="server" Text='< %# Bind("FirstName") %>'>< /asp:Label>  
  12.                 < asp:Label ID="Label2" runat="server" Text='< %# Eval("LastName") %>'>< /asp:Label>  
  13.             < /ItemTemplate>  
  14.         < /asp:TemplateField>  
  15.         < asp:BoundField DataField="Title" HeaderText="Title" SortExpression="Title" />  
  16.         < asp:BoundField DataField="HireDate" HeaderText="HireDate" SortExpression="HireDate" />  
  17.     < /Columns>  
  18. < /asp:GridView> 

每一个雇员的姓和名都显示在同一列里面了 

TemplateField:每一个雇员的姓和名都显示在同一列里面了

【编辑推荐】

  1. 使用ASP.NET DetailsView显示详细信息
  2. 熟悉DropDownList和ObjectDataSource的配合使用
  3. ASP.NET DropDownList的创建与填充
  4. 使用ASP.NET中的GridView和ObjectDataSource
  5. ASP.NET DropDownList使用范例
责任编辑:book05 来源: 博客园
相关推荐

2015-07-20 17:17:41

SQL Server

2009-07-28 08:55:56

TemplateFie

2021-01-21 15:44:03

vlookup函数数据区域Match函数

2010-10-27 13:16:41

oracle并行查询

2010-09-10 13:37:59

SQLCOUNT()函数

2016-12-16 19:13:33

扩展性数据库

2010-09-28 09:49:48

SQL字符串

2010-03-29 13:19:10

OracleMulti

2009-04-09 15:40:01

JSONJavaScript枚举

2021-12-22 09:01:23

PythonExcelPython基础

2009-02-05 17:25:46

虚拟化

2010-07-12 09:14:32

云计算百姓

2009-05-26 12:23:56

Linux变量文件命名

2019-07-05 18:06:18

ffsendFirefox SenLinux

2015-05-06 14:23:55

2016-11-22 09:15:54

2012-05-05 08:58:16

Android

2009-07-17 13:56:44

.Net Micro

2009-07-17 13:46:52

.Net Micro

2019-06-19 13:50:21

NeofetchLinux
点赞
收藏

51CTO技术栈公众号