@Antikiller14 мая 2014 в 07:35

lemongrab: плагин валидации веб-форм

4 мин

26K

JavaScript * jQuery *

+30

Комментарии 39

@datacompboy 14 мая 2014 в 07:46

«Использование нативного кода: если чекбокс включён, поле валидно только если в нём есть цифра, иначе — только если в нём есть нецифровой символ.»
не меняется валидность поля, если менять чекбокс — только когда редактируется само поле

@datacompboy 14 мая 2014 в 07:50

«Меня зовут: Связаться со мной можно:»
опять же глюк — форма не валидна (не указан телефон) если чекбокс «со мной можно связаться» ВЫКЛЮЧЕН. а должно ругаться когда он ВКЛЮЧЕН :)

@Antikiller 14 мая 2014 в 08:10

А тут вы правы, я перепутал условие. Поправил.

@Antikiller 14 мая 2014 в 07:55

Так и задумано, валидация повешена именно на текстовое поле. Чтобы валидация происходила и при смене состояния чекбокса, нужно повесить правило и на него.

@cdiem 14 мая 2014 в 07:50

Your form is UNACCEPTABLE!!!

@Antikiller 14 мая 2014 в 08:27

You need reconditioning!

@pfox 14 мая 2014 в 07:52

jqueryvalidation.org не подошел?

@Antikiller 14 мая 2014 в 07:56

А он умеет учитывать зависимости между полями?

@Fr3nzy 14 мая 2014 в 08:03

Кроме того, он использует hmtl5 validation rules www.html5rocks.com/en/tutorials/forms/constraintvalidation/?redirect_from_locale=ru.

@Antikiller 14 мая 2014 в 08:11

У меня они тоже используются.

@Fr3nzy 14 мая 2014 в 08:14

А зачем тогда подобное?

data-rule-valid='[{"key":"regexp","value":"^.{1,5}$"}]'

Есть же pattern.

@Antikiller 14 мая 2014 в 08:20

Извиняюсь, я не о том подумал.
Нет, этот способ задания правил у меня не используется, возможно, следует его добавить.

@pfox 14 мая 2014 в 07:59

да, может

$(".selector").validate({
  rules: {
    contact: {
      required: {
        depends: function(element) {
          return $("#contactform_email:checked")
        }
      }
    }
  }
});

немного модифицированная конструкция из документации

@Antikiller 14 мая 2014 в 08:43

Избыточно как-то, против:

data-rule-required='[{"key":"c","selector":"#contactform_email"}]'

Не нашёл в нём генерации событий. Остальное, думаю есть, но тут играет свою роль наличие фатального недостатка.

@AndryX 14 мая 2014 в 10:17

Вы мешаете код с представлением, это не особо хорошо

@Antikiller 14 мая 2014 в 10:24

Полностью согласен. Именно поэтому есть возможность выноса правил валидации (см. пример).
Представленный выше вариант, впрочем, тоже бывает удобен (для маленьких валидашек, или при прототипировании).

@AndryX 14 мая 2014 в 14:58

Да, и в примере код такой же как у jQuery Validator. Я это к тому что вы на пример JS-конфигурации привели контрагрумент с JSON-ом в data атрибуте. Все таки вещи это не одинаковые

@drakmail 14 мая 2014 в 09:10

Есть ли поддержка проверки валидности полей через ajax?

@Antikiller 14 мая 2014 в 09:20

Конкретнее опишите задачу.

@Fr3nzy 14 мая 2014 в 09:28

Возможно, я ошибаюсь, но, думаю, человек имеет в виду простой сценарий: ajax-валидатор. Иными словами, случай, когда валидация частично или полностью для формы/поля осуществляется сервером.

@drakmail 14 мая 2014 в 09:33

Именно, например, валидация уникальности email. Из всего, что пробовал, ни одного нормального варианта не нашел.

@Antikiller 14 мая 2014 в 10:14

Плагин задумывался как client-side — валидатор. Отправку собранных им данных на сервер можно прикрутить, но всю валидацию тоже придётся писать на сервере. В общем, у плагина другой юзкейс.

@vladsharikov 14 мая 2014 в 10:42

Почему другой юзкейс? Автору комментария необходимо проверить форму на лету (для этого и нужен ваш плагин), а вы говорите, что он не предназначен для этого. В таком случае придется делать проверку после отправки формы, а значит цель не достигнута. Как-то неправильно делать все проверки на лету, а проверку на уникальность почты после отправки, согласитесь.

По моему, этого не хватает. Когда прочитал заголовок поста, глаза загорелись, но теперь желание отпало. Хотелось бы иметь аналог remote из jquery validation plugin.

От себя вопрос. Есть ли возможность делать валидацию поля после задержки небольшой, скажем в 200 мс? Чтобы если вдруг ввел не подходящий по шаблону текст в поле, оно не срабатывало и отвлекало/отпугивало пользователя.

@Antikiller 14 мая 2014 в 11:19

>Почему другой юзкейс?

Потому что я рассмотрел ситуацию в общем случае, когда требуется взять содержимое полей формы, отправить (желательно — асинхронно) на сервер, чтобы сервер вернул состояние валидности ввода. Для этого не нужны 80% возможностей плагина.
При этом плагин может это делать, достаточно использовать клиентские функции.
Для случая drakmail сработает вот это: ставим полю, в котором нужно проверить уникальность почты, правило

data-rule-required='[{"key":"function","value":"is_unique()"}]'

и где-нибудь пишем функцию, возвращающую true/false в зависимости от результата проверки, что-нибудь вроде:


function is_unique(){
		return ($.ajax({url:"/checkemail.php?email="+$("#email").val(),async:false}));
}

Запрос должен быть синхронным. Для асинхронного варианта решение тоже возможно, например можно добавить собственный обработчик.

>Есть ли возможность делать валидацию поля после задержки небольшой
Валидация может происходить по определённому пользователем событию. Так что есть три варианта:
1) Создать своё событие, вызываемое в setInterval, и повесить валидацию на него;
2) Подписаться на события плагина, но реагировать на них с задержкой через setTimeout;
3) В том же setInterval проверять свойство isValid, например.

@vladsharikov 14 мая 2014 в 11:24

В итоге при существующем плагине необходимо наворотить еще тонну кода. С тем же успехом можно написать и свой плагин. Я вашу позицию понял.

@datacompboy 14 мая 2014 в 12:25

«А еще плагин в исходных кодах, и я готов принять пулл-реквест» — вот правильное окончание этой тирады ;)

@Antikiller 14 мая 2014 в 12:29

Плаг в паблик-репозитарии на гитхабе, так что это само собой разумеющийся факт.

@vladsharikov 15 мая 2014 в 19:40

Это же камень в мой огород? Понимаю. Я тоже думал «фигли мне вообще возникать, если лучше ничего не сделал» (да и вообще по сути ничего не сделал :) ), но автор выложил свое творение в паблик, тем более на хабр, он же не ждал, что его будут только хвалить? И критика какую-то нужно принимать, иначе зачем оно вообще все?

Я, возможно, сделал бы pull request в гитхабе jQuery Validtion Plugin'а, ибо он не устраивает меня только одним моментом — нет delay. А пока что, шило на мыло менять не зачем, правильно?

Я никак не высказываюсь против этого плагина, наоборот только за — нужно создавать. Автору бесспорно +, если бы кармы хватало, он молодец (я бы, если бы занимался, пилил бы это все долго и не факт, что правильно), но но но но есть «но», высказанное выше.

@datacompboy 16 мая 2014 в 03:55

Нет, это просто слишком характерный ответ вырисовывается из реакции автора плагина :)

@vladsharikov 16 мая 2014 в 07:20

И странный для человека, который выкладывает его в паблик и не хочет принимать критику :)

@Antikiller 16 мая 2014 в 07:44

Странно, я пока не видел от вас критики. Вижу вопросы «А как сделать вот это? — Вот так. — Ууу, тут ещё код писать надо, нафиг-нафиг».

Плаг решает одну конкретную задачу — обеспечивает клиент-сайд валидацию. Обеспечение задержки вывода — иная задача.

@vladsharikov 16 мая 2014 в 08:01

Надо помечать критику тегом, раз вы ее не замечаете?

Перед тем как создавать плагин, вы же рассмотрели имеющиеся аналоги? Для чего нужен jQuery Validation Plugin? Он решает одну конкретную задачу — выполняет валидацию форм. Вы говорите, что ваш плагин решает ту же задачу, но это и это делать не будет, для этого нужно написать еще кое что, этот плагин решает конкретную задачу.

По моему валидация форм подразумевает вывод ошибки рядом с формой или в заданном месте, к чему и относится задержка вывода.

Тоже самое с remote. Вместо двух строчек в jQuery Validation вы предлагаете написать свою функцию.

Если критику вы не видите/не хотите видеть, то и мне тут нечего делать, ибо это просто сотрясание воздуха с моей стороны. Засим удаляюсь. Без критики, мнение: продукт хорош, но надо допиливать, в данном варианте юзать бы не стал.

@Antikiller 16 мая 2014 в 08:19

>По моему валидация форм подразумевает вывод ошибки рядом с формой или в заданном месте, к чему и относится задержка вывода.

Нет. Валидация заключается в том, чтобы определить, заполнена ли форма в соответствии с заданными правилами. Всё остальное — в т.ч. вывод ошибки — к валидации не относится. Должна быть возможность самостоятельно определять реакцию на изменение валидности, остальное избыточно.
В частности из-за отсутствия такой возможности пришлось отказаться от использования аналогов.

>Вместо двух строчек в jQuery Validation вы предлагаете написать свою функцию.
Выше объяснил подробно, почему это это не юзкейс плагина.

>Если критику вы не видите/не хотите видеть, то и мне тут нечего делать
Это не критика, это непонимание сути задачи.
А вот это — уже вполне годное замечание, которое стоит учесть.

@vladsharikov 14 мая 2014 в 10:32

JQuery validation plugin в этом не помог? Метод remote.

@Antikiller 14 мая 2014 в 11:20

Вот такой вариант подходит?

@sintez 14 мая 2014 в 13:18

За название — респект :)

@DarthSim 15 мая 2014 в 06:27

Для придания особого обаяния нужно было все valid/invalid заменить на acceptable/unacceptable.

@Antikiller 15 мая 2014 в 06:39

Была идея весь код оформить фразами из AT, но в нашей команде только я смотрю этот мульт, и шутка осталась бы непонятой (тут и про Лемонохвата пришлось объяснять полчаса).

@Abcd_Efgh 15 мая 2014 в 11:59

Сделайте отдельную версию с аутэнтичными фразами :-)

Зарегистрируйтесь на Хабре, чтобы оставить комментарий