ASP.NET 4.0配置文件中的ClientIDMode属性详解

2019-05-25 09:24:38王冬梅

时光流逝,我们心爱的ASP.NET也步入了4.0的时代,微软在ASP.NET 4.0中对很多特性做了修改。比如我将要讨论的控件ID机制就是其中之一。

在ASP.NET 4.0之前我们总是要为控件的ClientID头疼,比如明明一个叫lblName的Label放在一个叫做grd的GridView里面后,在页面上改Label的ID就变成了诸如grd_clt02_lblName的一长串字符串,如果我们在前台想在使用JS的时候找到该Label,我们不得不用到C#脚本来获得该Label在前台的确切ID,诸如:

< type="text/ ">
  var lblName = document.getElementById("<%=lblName.ClientID %>");
</ >

在ASP.NET 4.0中的每个控件上都多了一个叫做ClientIDMode的属性,这就是解决上面获取控件ID难的解决方案。这个属性有四个可选值,根据所选值的不同它可以控制页面上生成控件的ID格式。

下面就让我们来了解下ClientIDMode属性的四个值:

1,AutoID:

当控件的ClientIDMode选中为AutoID时,该控件的ClientID 值是通过串联每个祖先容器控件(诸如GridView、ListView、LoginView等就是容器性控件)的ID和父容器控件的ID和其本身的ID 值生成的,当然如果该控件没有在任何容器控件中其ClientID 值就是其本身的ID值,不会做任何更改。 另外如果该控件所在的父容器控件或祖先容器控件有些是显示多个数据行的容器控件(例如GridView、ListView就是显示多数据行的容器控件),那么还将在这些容器控件的ID值的后面会插入一个递增的行号格式。 各部分之间以下划线字符 (_) 分隔。 可见在 ASP.NET 4 之前的版本中使用的就是AutoID方案来生成控件的ClientID 值。

比如下面这个GridView里面就有一个名叫Label1的ID,我们将Label1的ClientIDMode设置为了AutoID:

<asp:GridView ID="grd_Account" runat="server" AllowPaging="True" 
  AutoGenerateColumns="False" 
  DataKeyNames="Account Number" DataSourceID="sds_account" Height="63px" 
  Width="676px" PageSize="5" ClientIDMode="AutoID" >
  <Columns>
    <asp:TemplateField HeaderText="Account Number" Sort ="Account Number">
      <ItemTemplate>
        <asp:Label ID="Label1" runat="server"
          Text='<%# Bind("[Account Number]") %>' ClientIDMode="AutoID"></asp:Label>
      </ItemTemplate>
    </asp:TemplateField>
  </Columns>
</asp:GridView>

该GridView生成的客户端HTML代码就是:

<table cellspacing="0" rules="all" border="1" id="grd_Account" style="height:63px;width:676px;border-collapse:collapse;">
  <tr>
    <th scope="col">Account Number</th>
  </tr>
    <tr>
  <td>
      <span id="grd_Account_ctl02_Label1">1060</span>
    </td>
  </tr>
    <tr>
  <td>
      <span id="grd_Account_ctl03_Label1">1200</span>
    </td>
  </tr>
    <tr>
  <td>
      <span id="grd_Account_ctl04_Label1">1510</span>
    </td>
  </tr>
</table>