带Value属性的扩展CheckBox控件

ASP.NET 的CheckBox 提供了对 <input type="checkbox" /> 标记的封装，但是CheckBox没有提供与客户端相对应的 value 属性，而很多时候（不管是server side 或者client side ）我们在确定某个CheckBox 被 checked，也需要获取一个对应的 value。
如何解决？其实方法很多。

1. 为每个CheckBox 提供 HiddenField，将 CheckBox对应的Value存储在HiddenField中
   缺点：麻烦，繁琐。
2. 为每个CheckBox 提供 ViewState，将 CheckBox对应的Value存储在ViewState中
   缺点：无法在client side 读取。
3. 换用CheckBoxList，因为 CheckBoxList 实现了 ListControl，同时具有Text和Value属性
   缺点：单个CheckBox不合适。适合于多个CheckBox的组合。
   knonwn bug: CheckBoxlist 内部使用的 ListITem.Attributes 为实现视图（ViewState） updated: @07-05-13
4. 换用Html服务器控件：<input runat="server" type="checkbox" />
   缺点：没有了Text属性，如果需要需要自行添加。
5. 开发自己的扩展CheckBox，使之具有Value属性，并对<input type="checkbox" valu="somevlaue" />对应。
6. more unknown solutions。^_^

下面就是一个扩展的CheckBox：

[DefaultProperty( " Text " )]
[ToolboxData( " <{0}:XCheckBoxrunat=/ " server/ " /> " )]
public class XCheckBox:CheckBox
{
[Bindable(true)]
[Category("Appearance")]
[DefaultValue("")]
[Localizable(true)]
publicstringValue
{
get
{
Strings=(String)ViewState["Value"];
// updated @07-05-13
return String.IsNullOrEmpty(s) ? "on" : s;
//return((s==null)?String.Empty:s);
}
set
{
//将值存储在ViewState中
ViewState["Value"]=value;
}
}

protectedoverridevoidRenderContents(HtmlTextWriteroutput)
{
base.RenderContents(output);
}

protectedoverridevoidAddAttributesToRender(HtmlTextWriterwriter)
{
//添加value属性标记（在客户端呈现），并设置对应Value属性值（服务器端）
writer.AddAttribute(HtmlTextWriterAttribute.Value,Value);
base.AddAttributesToRender(writer);
}
}

下面是改控件呈现的HTML：

< input value ="valueOfXCheckBox1" id ="XCheckBox1" type ="checkbox" name ="XCheckBox1" />< label for ="XCheckBox1" > textOfXCheckBox1 </ label >

需要注意的是：
如果在 Value 属性的 set 访问器中这样设置：

this .Attributes[ " value " ] = value;

asp。net引擎不会在客户端呈现 value属性标记，因此不会得到预期的效果
但是如果设置其他属性却是可以的：

this .Attributes[ " onclick " ] = " alert(this.id) " ;

anybody knows why?

updated：2007年5月13日
发现了一个bug，当你将checkbox的value设置成空字符串的时候，如，
checkbox1.Attributes["value"] = "";
那么当页面回发（PostBock）的时候服务端无法真正获取此checkbox.checked 属性，此时永远返回页面初次请求的checkbox1.checked值，
后来才明白，原来html form中对于 <input type=checkbox>的value属性 具有默认值：on，如果这样设置<input type="checkbox" value="" />，那么表单回发是不会包含此 checkbox的，服务器自然也得不到这个值（asp.net 中通过 Request.Form 集合获取）
因此，应该如此修改 XCheckBox.Value 实现：

[Bindable( true )]
[Category( " Appearance " )]
[DefaultValue( "" )]
[Localizable( true )]
public string Value
{
get
{
Strings=(String)ViewState["Value"];
returnString.IsNullOrEmpty(s)?"on":s;
}
set
{
ViewState["Value"]=value;
}
}

posted on 2006-08-31 12:27 晓风残月 阅读(609) 评论(4) 编辑 收藏 所属分类: asp.net 、 asp.net 2.0

<!-- <rdf:RDF xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:trackback="http://madskills.com/public/xml/rss/module/trackback/"> <rdf:Description rdf:about="http://www.cnblogs.com/Jinglecat/archive/2006/08/31/491221.html" dc:identifier="http://www.cnblogs.com/Jinglecat/archive/2006/08/31/491221.html" dc:title="带Value属性的扩展CheckBox控件" trackback:ping="http://www.cnblogs.com/Jinglecat/services/trackbacks/491221.aspx" /> </rdf:RDF> -->

<!--done-->
FeedBack:

#1楼 [ 楼主]

2006-09-01 22:15 | 晓风残月

今天发现了一个bug,
如果对xcheckbox应用theme，将不会得到预期的呈现，变成了：
<span value="1" title="选择"><input id="chkItem" type="checkbox" name="chkItem" /></span>

不知道为什么？等待研究...

不过，client side还是可以使用 chkItem.parentNode.value 方便的获取。
回复 引用 查看

#2楼 [ 楼主]

2006-09-01 22:22 | 晓风残月

终于发现并不是theme的问题，
而是asp.net再呈现checkbox本身的问题：
如果对checkbox应用tooltip属性，就会对该checkbox附加span标记，将title应用到span里面。
<asp:checkbox id="CheckBox1" runat="server" tooltip="check me" />
呈现成：
<span title="check me"><input id="CheckBox1" type="checkbox" name="CheckBox1" /></span>
而不是预期的
<input id="CheckBox1" type="checkbox" name="CheckBox1" title="check me" />
回复 引用 查看

#3楼 [ 楼主]

2007-05-13 13:19 | 晓风残月

发现了一个bug，当你将checkbox的value设置成空字符串的时候，如，
checkbox1.Attributes["value"] = "";
那么当页面回发（PostBock）的时候服务端无法真正获取此checkbox.checked 属性，此时永远返回页面初次请求的checkbox1.checked值，
后来才明白，原来html form中对于 <input type=checkbox>的value属性 具有默认值：on，如果这样设置<input type="checkbox" value="" />，那么表单回发是不会包含此 checkbox的，服务器自然也得不到这个值（asp.net 中通过 Request.Form 集合获取）


回复 引用 查看

#4楼

2007-07-16 10:09 | zxz524 [未注册用户]

还是有问题,如果设置CssClass value 就会被重写到span标签上去
回复 引用 查看