Validate Radio Buttons with Only One Error Message
The following example demonstrates how to validate a group of Kendo UI radio buttons and show only one error message.
<div id="form">
<span class="k-invalid-msg" data-for="test"></span><br/>
Test 1<input type="radio" name="test" required /><br/>
Test 1<input type="radio" name="test" required /><br/>
Test 1<input type="radio" name="test" required /><br/>
Test 1<input type="radio" name="test" required /><br/>
Test 1<input type="radio" name="test" required /><br/>
<button id="post">Post</button>
</div>
<script>
$(function(){
var validator = $("#form").kendoValidator({
rules: {
radio: function(input) {
if (input.filter("[type=radio]") && input.attr("required")) {
return $("#form").find("[type=radio][name=" + input.attr("name") + "]").is(":checked");
}
return true;
}
},
messages: {
radio: "This is a required field"
}
}).getKendoValidator();
$("#post").click(function() {
validator.validate();
});
});
</script>