3.09.2008
Validatable CheckBox control
So, a fairly common problem I've seen is that there's no home-baked way to validate a CheckBox control. This is most commonly used when registering on websites that require a user to agree to certain terms and conditions. I've seen a fair number of solutions, most of which involve writing a custom validator, which in my opinion, can get a little tricky. Well, to this, I say NO!
I took a different approach - instead of trying to make a custom validator for the CheckBox, why not just modify the CheckBox control so that it can be validated by a RequiredFieldValidator?
On the server side, this is as simple as creating a class that inherits from System.Web.UI.WebControls.CheckBox and adding the ValidationPropertyAttribute, like so:
[ValidationProperty("Checked")]
public class ValidatableCheckBox : CheckBox
The client side is a little bit more involved, but still fairly simple.
ASP.NET's client side validation checks an element's value property. If it returns anything, it is considered validated. Since the "value" property of a checkbox element returns "on" or "off", it will always be considered validated. To deal with this, I've created a javascript class that effectively overrides the "value" property of the CheckBox control's client HTML element so that it returns an empty string instead of "off" when it is unchecked.
You can check it out here.
To associate that javascript class with our server side control, you need to implement the IScriptControl interface. (For more info, see Adding Client Capabilities to a Web Server Control by Using ASP.NET AJAX Extensions)
I've done this here.
That is all! You can see it in action here, or download the demo solution here.
I took a different approach - instead of trying to make a custom validator for the CheckBox, why not just modify the CheckBox control so that it can be validated by a RequiredFieldValidator?
On the server side, this is as simple as creating a class that inherits from System.Web.UI.WebControls.CheckBox and adding the ValidationPropertyAttribute, like so:
[ValidationProperty("Checked")]
public class ValidatableCheckBox : CheckBox
The client side is a little bit more involved, but still fairly simple.
ASP.NET's client side validation checks an element's value property. If it returns anything, it is considered validated. Since the "value" property of a checkbox element returns "on" or "off", it will always be considered validated. To deal with this, I've created a javascript class that effectively overrides the "value" property of the CheckBox control's client HTML element so that it returns an empty string instead of "off" when it is unchecked.
You can check it out here.
To associate that javascript class with our server side control, you need to implement the IScriptControl interface. (For more info, see Adding Client Capabilities to a Web Server Control by Using ASP.NET AJAX Extensions)
I've done this here.
That is all! You can see it in action here, or download the demo solution here.
Labels: checkbox, checkbox validation, checkbox validator, checkboxvalidator, validation
Subscribe to Posts [Atom]