Too many notices with radio type fields

2 posts, 0 answers
  1. Mate
    Mate avatar
    13 posts
    Member since:
    Sep 2013

    Posted 07 Jan 2015 Link to this post

    Hi,

    I am trying to validate radio type fields, and it works, but with an annoying side effect from a user point of view.
    When I try to submit the form without checking a radio button from a list of 10 choices, I get 10 notices that it is a required field, when it should be only 1 notice.

    I use the code below for validation:
    01.$(document).ready(function(){
    02. 
    03.           $(".edit_filling").kendoValidator({
    04.              rules: {
    05.                radio: function(input){
    06.                  if (input.filter("[type=radio]") && input.attr("required")) {       
    07.                        return $(".edit_filling").find("[data-qs=" + input.attr("data-qs") + "]").is(":checked");
    08.                  }
    09.                  return true;
    10.                }
    11.              },
    12.              messages: {
    13.                radio: "This is a required field"
    14.              }
    15.            });
    16. 
    17.       });

    What happens without checking a radio button:

    What was the make of Your first car?
    1. Chevrolet This is a required field
    2. Ford This is a required field
    3. Mercedes This is a required field
    4. BMW This is a required field
    5. Ferrari This is a required field
    6. Citroen This is a required field
    7. Renault This is a required field
    8. Seat This is a required field

    What should happen:

    What was the make of Your first car?
    This is a required field
    1. Chevrolet
    2. Ford
    3. Mercedes
    4. BMW
    5. Ferrari
    6. Citroen
    7. Renault
    8. Seat

    Please help me to solve this issue.
  2. Georgi Krustev
    Admin
    Georgi Krustev avatar
    3706 posts

    Posted 09 Jan 2015 Link to this post

    Hello Mate,

    I would suggest you use a dedicated error span element that you can place wherever you want. Here is a Dojo demo that demonstrates this approach.

    Regards,
    Georgi Krustev
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
  3. Kendo UI is VS 2017 Ready
Back to Top