MVC4：在表单或摘要上显示验证错误，而不是输入？

Question

I'm trying to leverage some form validation to do something it really wasn't designed to do. I have a table in my form and each row has a checkbox. I want to ensure that at least one of a specific type of checkbox is selected, if not I want to show a validation error. I am doing something similar with a text box with logic that looks like this:

function ValidateName() {

var $nameTextbox = $("#Name");
var $originalName = $("#OriginalName");
var nameText = $nameTextbox.val().toLowerCase();
var originalNameText = $originalName.val().toLowerCase();

//check to see if original name and group name match
if (nameText != originalNameText) {
    //This isn't the same name we started with
    if (uniqueNames.indexOf(nameText) > -1) {
        //name isn't unique, throw validation error
        var currentForm = $nameTextbox.closest("form");

        //trigger validation
        var errorArray = {};
        errorArray["Name"] = 'Name must be unique';
        currentForm.validate().showErrors(errorArray);
    }
}

}

I've written something similar for the table and it works as long as I point the errorArray's index to the id of an input. However, I want to display the error somewhere more generic like the validation summary at the top of the form. How do I set up the error array to show on the form or the validation summary instead of a specific input? Is that even possible?

Answer 1

One way you could do this is you set a hidden input that is false when none are check and true if 1 or more are checked. You then listen to all the checkboxes by giving them all a class. I have an example shown below

http://jsfiddle.net/95acw2m9/

Html

<input type="hidden" id="IsCheckValue" name="IsCheckedValue" value="false"/>

<input type="checkbox" class="someCheckbox"/>
<input type="checkbox" class="someCheckbox"/>
<input type="checkbox" class="someCheckbox"/>

Jquery

  $(document).ready(function(){
    $(".someCheckbox").change(function(){
        if($(".someCheckbox:checked ").length > 0){
            $("#IsCheckValue").val("True")
        }else{
            $("#IsCheckValue").val("False")
        }
    })
})

Then pass that bool value in your model. In your controller method you can check the value of the bool. If the bool is false set the model to false like this

ModelState.AddModelError("Checkbox", "Must select one checkbox");

You can use the @Html.ValidationSummary() to display the error in your view.