Question

192

MVC unobtrusive validation on checkbox not working

rated 0 times [ 193] [ 1] / answers: 1 / hits: 27044 / 13 Years ago, wed, august 3, 2011, 12:00:00

I'm trying to implement the code as mentioned in this post. In other words I'm trying to implement unobtrusive validation on a terms and conditions checkbox. If the user hasn't selected the checkbox, then the input should be marked as invalid.

This is the server side Validator code, I've added:

/// <summary>

/// Validation attribute that demands that a boolean value must be true.

/// </summary>

[AttributeUsage(AttributeTargets.Property, AllowMultiple = false, Inherited = false)]

public class MustBeTrueAttribute : ValidationAttribute

{

    public override bool IsValid(object value)

    {

        return value != null && value is bool && (bool)value;

    }

}

This is the model

[MustBeTrue(ErrorMessage = You must accept the terms and conditions)]

[DisplayName(Accept terms and conditions)]

public bool AcceptsTerms { get; set; }

This is my view:

@Html.EditorFor(x => x.AcceptTermsAndConditions)

@Html.LabelFor(x => x.AcceptTermsAndConditions)

@Html.ValidationMessageFor(x => x.AcceptTermsAndConditions)

and this is the jQuery I've used to attach the validator client side:

$.validator.unobtrusive.adapters.addBool(mustbetrue, required);

The client side script doesn't appear to be kicking in, however. Whenever I press the submit button, validation on the other fields kicks in fine, but the validation for the Terms & conditions doesn't seem to kick in. This is how the code looks in Firebug after I've clicked the submit button.

<input type=checkbox value=true name=AcceptTermsAndConditions id=AcceptTermsAndConditions data-val-required=The I confirm that I am authorised to join this website and I accept the terms and conditions field is required. data-val=true class=check-box>

<input type=hidden value=false name=AcceptTermsAndConditions>

<label for=AcceptTermsAndConditions>I confirm that I am authorised to join this website and I accept the terms and conditions</label>

<span data-valmsg-replace=true data-valmsg-for=AcceptTermsAndConditions class=field-validation-valid></span>

Any ideas? Have I missed out a step? This is driving me potty!

Thanks in advance
S

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

arron

Add To Favorites

Follow

Total Points: 663

Total Questions: 119

Total Answers: 112

Location: Belize

Member since Mon, Jun 20, 2022

2 Years ago

answered 13 Years ago yaquelina · Accepted Answer

Sniffer,

In addition to implementing Darin's solution, you also need to modify the file jquery.validate.unobtrusive.js. In this file, you must add a mustbetrue validation method, as follows:

$jQval.addMethod(mustbetrue, function (value, element, param) {

    // check if dependency is met

    if (!this.depend(param, element))

        return dependency-mismatch;

    return element.checked;

});

Then (I forgot to add this at first), you must also add the following to jquery.validate.unobtrusive.js:

adapters.add(mustbetrue, function (options) {

    setValidationValues(options, mustbetrue, true);

});

counsellorben