Для проверки заполнения формы вместо 

JHtml::_('behavior.formvalidation');

лучше использовать добавления кода валидатора напрямую

window.addEvent('domready', function() {
 var myFormValidator = new Form.Validator($('adminForm'));
});

где adminForm - id формы

<form action="#" method="post" name="adminForm" id="adminForm">

Существую предопределеные правила проверки

  • required
  • length
  • minLength
  • maxLength
  • validate-numeric
  • validate-integer
  • validate-digits
  • validate-alpha
  • validate-alphanum
  • validate-date
  • validate-email
  • validate-url
  • validate-currency-dollar
  • validate-one-required

Чтобы использовать предопределенное правило в нужный тэг добавляем соответствующий класс:

<input type="text" class="validate-alpha" value="" />

В данном случае, если поле оставить пустым ошибки не будет, чтобы сделать это поле обязательным, добавим еще валидатор required

<input type="text" class="validate-alpha required" value="" />

Вывод сообщений об ошибках делается так:

window.addEvent(&#39;domready&#39;, function() {
 var myFormValidator = new Form.Validator($(&#39;adminForm&#39;),
  {
   onElementFail: function(el, validator) {
    alert(this.getValidator(validator[0]).getError(el));
   }
  }
 );
});

Самое сложное тут было найти сообщение об ошибке )

Теперь осталось перевести на русский сами сообщения об ошибках

l = Locale.getCurrent().name;
 
Locale.define(l, &#39;FormValidator&#39;, {
 alpha: "Пожалуйста, используйте только буквы (A-Z). Без пробелов и других символов."
});

Можно сразу добавить переводы для всех предопределенных проверок.

Перевел с помощью переводчика Google

window.addEvent(&#39;domready&#39;, function() {
 
 l = Locale.getCurrent().name;
 
 Locale.define(l, &#39;FormValidator&#39;, {
  required: "Это поле обязательно для заполнения",
  numeric: &#39;Пожалуйста, введите только числовые значения ("1" или "1,1" или "-1" или "-1,1")&#39;,
  integer: "Пожалуйста, введите целое число. Номера с десятыми (например, 1,25) не допускаются",
  digits: "Пожалуйста, используйте только цифры, избегайте пробелов и других символов, таких как точки или запятые.",
  alpha: "Пожалуйста, используйте только буквы (A-Z). Без пробелов и других символов.",
  alphanum: "Пожалуйста, используйте только буквы (AZ) и цифры (0-9). Без пробелов и других символов.",
  email: "Пожалуйста, введите правильный адрес электронной почты. Например, fred@domain.com",
  url: "Пожалуйста, введите правильный URL"
 });
 
var myFormValidator = new Form.Validator($(&#39;adminForm&#39;),
{
onElementFail: function(el, validator) {
alert(this.getValidator(validator[0]).getError(el));
}
}
);
});

Можно также добавлять свои правила проверки:

myFormValidator.add(&#39;isEmpty&#39;, {
 errorMsg: &#39;This field is required&#39;,
 test: function(element){
  if (element.value.length == 0) return false;
  else return true;
 }
});

или еще

myFormValidator.add(&#39;validate-alpha&#39;,
{
errorMsg: &#39;Пожалуйста, используйте только буквы (A-Z, А-Я). Без пробелов и других символов.&#39;,
test: function(element)
{
regex=/^[a-zA-Zа-яА-Я]+$/;
return element.get(&#39;value&#39;).test(regex,&#39;i&#39;);
}
}
);

Проверку можно делать не для всех полей сразу, для этого устанавливаем свойство serial в false

var myFormValidator = new Form.Validator(
 $(&#39;adminForm&#39;),
 {
  serial: false,
  onElementFail: function(el, validator) {
 
   alert(this.getValidator(validator[0]).getError(el));
 
  }
 }
);

 

Комментарии   

#1 Денис 21.08.2015 22:11
Спасибо огромное. Я искал именно подобное описание работы с валидатором, имею ввиду вывод сообщений)) Писал аякс модуль авторизации на джумла и пришлось отказаться на стороне клиента от проверки именно по причине отсутствия вывода сообщений, и вот сегодня наткнулся на Вашу статью... Еще раз огромное спасибо)). Добавил Ваш сайт в закладки теперь буду частенько почитывать Ваши материалы!

Чтобы сделать комментарий, нужно авторизоваться на сайте!