母版页中获取控件ID

背景

当一个控件在模板页中时，这个控件的Client ID将会被附着与他的Content placeholder ID.所以，如果一个元素的ID为txtTest”,那么这个新的Client ID就会像"ctl00_ContentPlaceHolder1_ txtTest”.

所以，当你试着用document.getElementById(‘txtTest’), 你将无法使用javascript来访问txtTest，你需要通过调用document.getElementById(‘ctl00_ContentPlaceHolder1_ txtTest’)来访问它。

为了避免对这个较长的Client ID进行硬编码，我们可以通过使用document.getElementById('<%=txtTest.ClientID%>')访 问控件，这样就能够访问txtTest.现在它将会奏效除非javascript与aspx也一致，也就是说，当javascript作为aspx页的一 部分时，这样写挺奏效的。但是如果把javascript语句放到单独的.js文件中通过指定路径引用到aspx页面的话，这样写就不行了。

所以，在这个脚本里，为了获取控件，我们不得不硬编码控件的ID，但是硬编码不是编码的理想方式，为了避免这种状况，我们 所能做的是在Client ID和Server ID间保持一个映射，在javascript代码中，我们能够根据给定的Server ID获取Client ID,这个将在下面被实现。

使用这些编码

在上面所说的将会在这里实现，第一，我们需要申明两个数组；第一个数组用来存储控件Server ID，第二个数组在同样的位置存放服务器控件的Client ID.在客户端注册这两个数组。现在，生成一个javascript的函数，接收server ID并且用这个server ID和数组中存储的server ID进行比较，给出它在数组中的位置。然后，同样的函数将会根据这个位置在Client ID数组中找到对应的Client ID.我感觉这是保持Client和Server IDs映射的最简单的方法。

这段代码显示了数组的定义以及javascript的申明。

View Code

1 public void RenderJSArrayWithCliendIds( params Control[] wc)
2 {
3 if (wc.Length > 0 )
4 {
5 StringBuilder arrClientIDValue = new StringBuilder();
6 StringBuilder arrServerIDValue = new StringBuilder();
7
8 // Get a ClientScriptManager reference from the Page class.
9 ClientScriptManager cs = Page.ClientScript;
10
11 // Now loop through the controls and build the client and server id's
12 for ( int i = 0 ; i < wc.Length; i ++ )
13 {
14 arrClientIDValue.Append( " \" " +
15 wc[i].ClientID + " \", " );
16 arrServerIDValue.Append( " \" " +
17 wc[i].ID + " \", " );
18 }
19
20 // Register the array of client and server id to the client
21 cs.RegisterArrayDeclaration( " MyClientID " ,
22 arrClientIDValue.ToString().Remove(arrClientIDValue.ToString().Length - 1 , 1 ));
23 cs.RegisterArrayDeclaration( " MyServerID " ,
24 arrServerIDValue.ToString().Remove(arrServerIDValue.ToString().Length - 1 , 1 ));
25
26 // Now register the method GetClientId, used to get the client id of tthe control
27 cs.RegisterStartupScript( this .Page.GetType(), " key " ,
28 " \nfunction GetClientId(serverId)\n{\nfor(i=0; i<MyServerID.length; i++) " +
29 " \n{\nif ( MyServerID[i] == serverId )\n " +
30 " {\nreturn MyClientID[i];\nbreak;\n}\n}\n} " , true );
31 }
32 }

这是得到Client和Server IDs映射的最简单的方法。这里，没有必要担心在外部javascript文件中访问模板页中的控件。

现在我们可以通过如下代码访问在javascript中被提交到RenderJSArrayWithCliendIds函数中的控件。

var TextBox = document.getElementById(GetClientId("txtTest"));

这个将会解决由于控件在模板页中使得Client IDs改变而产生的任何问题。

转载于:https://www.cnblogs.com/bihu/archive/2011/03/16/1985753.html