Как я могу проверить полное имя, используя addMethod в jQuery Validator?

Question

В настоящее время я использую jQuery Validate для проверки данных формы, и я использую регулярное выражение для нескольких полей, чтобы проверить правильность, используя шаблоны.Однако даже после применения моего нового метода проверки с помощью addMethod форма все еще позволяет людям отправлять форму, используя только имя в поле полного имени.

Для моего поля полного имени я уже проверил свойregex работает, проверяя его в поле без использования novalidate в моей форме.

Regex: ^([a-zA-Z]{2,}\s[a-zA-z]{1,}'?-?[a-zA-Z]{2,}\s?([a-zA-Z]{1,})?)

попытка addMethod

jQuery.validator.addMethod("fullname", function(value, element) {
    return this.optional(element) || /^([a-zA-Z]{2,}\s[a-zA-z]{1,}'?-?[a-zA-Z]{2,}\s?([a-zA-Z]{1,})?)/.test(value);
}, 'Please enter your full name.');

<input id="full-name" name="Full_Name" type="text" class="form-control" placeholder="John Doe" required>

Если одно имя(например, Джон) вводится вместо полного имени, мое регулярное выражение должно пометить его как недействительное и запросить полное имя человека.

Answer 1

Вам нужно сделать две вещи:

• Сначала верните true, если проверка прошла успешно, false в противном случае.

• Во-вторых, фактически вызывает недавно добавленный метод в .validate().

Это можно увидеть в следующем:

jQuery.validator.addMethod("fullname", function(value, element) {
  if (/^([a-zA-Z]{2,}\s[a-zA-z]{1,}'?-?[a-zA-Z]{2,}\s?([a-zA-Z]{1,})?)/.test(value)) {
    return true;
  } else {
    return false;
  };
}, 'Please enter your full name.');

$("#sample").validate({
  rules: {
    Full_Name: { // Corresponds to the `name` attribute
      required: true,
      fullname: true // Attaches the new method to the element
    }
  },
  submitHandler: function(form, e) {
    e.preventDefault();
    console.log('The form is valid and would have been submitted successfully');
  },
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.19.0/jquery.validate.min.js"></script>

<form id="sample">
  <input id="full-name" name="Full_Name" type="text" class="form-control" placeholder="John Doe" required>
  <button id="submit">Submit</button>
</form>