体验ASP.NET4之ClientID

2009-10-26 23:17 Jun1st 阅读(2541) 评论(14) 编辑收藏举报

在ASP.NET中，我们赋给一个服务器端控件的ID值，并非真正这个控件在浏览器中展现时的Html的ID值，Framework会默认把父控件的ID值用”_”区分附加到自己的ID前面，因此我们在Html中看到的ID值通常是这个样子的:”ctl0_UserControl1_ctl01_Textbox1“。

这一ID的生成方式对于后台代码来说，并没有什么影响，但是却给客户端的操作带来了很多的不便。比如，我们不能直接在javascript和css代码中直接使用”Textbox1”这一ID。在JS代码中，我们需要使用ClientID这一属性。而对于CSS，则需要使用控件的CssClass属性来work around这一问题。

好了，现在ASP.NET 4给我们带来了ClientIDMode这一属性，通过设置这个Mode，我们可以控制”ClientID”的生成方式

四种Model

Legacy: ClientIDMode的default值，这时的ClientID值就是经典的“ctl0_UserControl1_ctl01_Textbox1”
Inherit：这个是每一个控件的默认的行为，它会继承它的父控件的mode属性
Static :顾名思义，控件的ID值就是最终的ClientID值。因此，如果在一个repeating的控件中使用这一个属性，就得负责保证ClientID的唯一性
Predictable：相对来说这个属性比较复杂。在Predictable模式下，生成的ClientID值得模式是：[Prefix]_[ID]_[Suffix]

Legacy Model

在Legacy模式下生成的ClientID就是我们最为熟悉的，如”ctl0_UserControl1_ctl01_Textbox1”。

Inherit Model

在控件没有设置ClientIDMode值是，它的default值为Legacy。但是，子控件会默认继承父控件的Mode值，如果父控件的Mode值不为Legacy，那么子空间的Mode值就修改为父控件的值

Static Model

当控件的ClientIDMode值为Static时，控件的ID就为最后我们通过view source看到的ID值

Predictable

Predictable mode经常被用在如ListView, DataList等这样的数据绑定控件上。[Prefix]_[ID]_[Suffix] 中的[Prefix]为父控件的ID，中间的[ID]就为自己的ID值，而这个[Suffix]就依情形而定了。在Predictable模式下，名为ClientIDRowSuffix的属性值可以用来设置这一Suffix，但是这个值必须为Data Key Collections中的一个。可以给ClientIDRowSuffix设置多个值，如ClientIDRowSuffix=“ProductID， Name”，这时生成的最终的ID值就是[Prefix]_[ID]_ProductID_Name。如果没有给ClientIDRowSuffix赋值(比如使用Repeater控件时)，那么这一Suffix就是这时的RowIndex

理论讲完了,该是实践的时候了。借用一句经常在英文书上看到的一句: It’s time to get your hands dirty! 附上source code, 置底。

Summary

个人感觉，能够控制这个ClientID还是很值得推荐和使用的一个功能，尤其是在JS和CSS代码无处不在的Web时代，给我们开发人员带来很多的方便之处。而相对于url routing功能，这一功能率先被用到的概率应该会大得多。

Sample 需要用VS 2010 Beta2来打开