25
SepCustom Validation for Checkbox in MVC Razor
This article will demonstrate, how to check whether checkbox is checked or not in Asp.Net MVC4 Razor application using custom server-side and client-side validation.
How to do it..
Follow the following steps for validating checkbox in mvc razor.
Step 1 : Making Custom Attribute
public class RegistrationModel { [Required(ErrorMessage = "Please Enter Email Address")] [RegularExpression(".+@.+\\..+", ErrorMessage = "Please Enter Correct Email Address")] public string UserName { get; set; } [Required(ErrorMessage = "Please Enter Address")] [Display(Name = "Address")] public string Address { get; set; } // Applying Custom Attribute [MustBeTrue(ErrorMessage = "Please Accept the Terms & Conditions")] public bool TermsAccepted { get; set; } } //Making Custom attribute for validating checkbox // IClientValidatable for client side Validation public class MustBeTrueAttribute : ValidationAttribute, IClientValidatable { public override bool IsValid(object value) { return value is bool && (bool)value; } // Implement IClientValidatable for client side Validation public IEnumerable<ModelClientValidationRule> GetClientValidationRules(ModelMetadata metadata, ControllerContext context) { return new ModelClientValidationRule[] { new ModelClientValidationRule { ValidationType = "checkboxtrue", ErrorMessage = this.ErrorMessage } }; } }
Step 2: Making Custom Validation using jQuery
@model Mvc4_Model_ServerSideValidation.Models.RegistrationModel @{ ViewBag.Title = "Validating CheckBox"; } <script src="../../Scripts/jquery-1.7.1.min.js" type="text/javascript"></script> <script src="../../Scripts/jquery.validate.min.js" type="text/javascript"></script> <script src="../../Scripts/jquery.validate.unobtrusive.min.js" type="text/javascript"></script> <script type="text/jscript"> //Custom jQuery validation unobtrusive script and adapters jQuery.validator.unobtrusive.adapters.add("checkboxtrue", function (options) { if (options.element.tagName.toUpperCase() == "INPUT" && options.element.type.toUpperCase() == "CHECKBOX") { options.rules["required"] = true; if (options.message) { options.messages["required"] = options.message; } } }); </script> <h2>Custom Validation for CheckBox </h2> @using (Html.BeginForm()) { <fieldset> <legend>Custom Validation for Cascading Dropdown List</legend> <ol> <li> @Html.LabelFor(m => m.UserName) @Html.TextBoxFor(m => m.UserName, new { maxlength = 50 }) @Html.ValidationMessageFor(m => m.UserName) </li> <li> @Html.LabelFor(m => m.Address) @Html.TextAreaFor(m => m.Address, new { maxlength = 200 }) @Html.ValidationMessageFor(m => m.Address) </li> <li> @Html.CheckBoxFor(m => m.TermsAccepted) @Html.ValidationMessageFor(m => m.TermsAccepted) </li> </ol> <input type="submit" value="Submit" /> </fieldset> }
How it works..
Now, you have applied the custom validation to the checkbox. This validation works for client-side and server side.
What do you think?
I hope you will enjoy the tricks while programming with MVC Razor. I would like to have feedback from my blog readers. Your valuable feedback, question, or comments about this article are always welcome.
Take our free skill tests to evaluate your skill!

In less than 5 minutes, with our skill test, you can identify your knowledge gaps and strengths.