JavaScript
Article

jQuery Group DOB Rules Form Validation

By Sam Deering

If you have more than 1 field which you want to validate as a group and not display 3 separate validation messages (such as date of birth, address etc…) this is how you can do it! Group your validation rules into 1 Validation Message, great to know!

$("form").validate({
  rules: {
      DayOfBirth: { required: true },
      MonthOfBirth: { required: true },
      YearOfBirth: { required: true }
  },
  groups: {
      DateofBirth: "DayOfBirth MonthOfBirth YearOfBirth"
  },
  errorPlacement: function(error, element) {
     if (element.attr("name") == "DayOfBirth" || element.attr("name") == "MonthOfBirth" || element.attr("name") == "YearOfBirth") 
      error.insertAfter("#YearOfBirth");
     else 
      error.insertAfter(element);
}});
Sam Deering
Meet the author
Sam Deering is a Front-end Web Developer who specialises in JavaScript & jQuery. Sam is driven and passionate about sharing his knowledge to educate others.

No Reader comments

Learn Coding Online
Learn Web Development

Start learning web development and design for free with SitePoint Premium!