Custom Validation for Checkbox in MVC Razor
Checkboxes: An Overview
Checkboxes are used in a Razor Pages form to ensure users select zero or more predefined options. Checkboxes are nothing but a type of input element, and some aspects of their behavior are unique and need to be understood when deciding whether, and how to use them. In this MVC Tutorial, we will explore more about Custom Validation for Checkbox in MVC Razor. Consider our ASP.NET MVC Course for a better understanding of all MVC core concepts.
How to do it.
Follow the following steps to validate the 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 the client side and server side.
Conclusion
So in this article, we have learned about validating checkboxes in mvc3&4. I hope you enjoyed learning these concepts while programming with Asp.Net. Feel free to ask any questions from your side. Your valuable feedback or comments about this article are always welcome. Level up your career in MVC with our ASP.Net Core Certification.
FAQs
Q1. How do you write a validation for a checkbox?
Q2. How to check validation in checkbox?
Q3. What is required validation in MVC checkbox?
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.