AjaxForm вывод своего pop-up, валидация форм.

Добрый день. Прошу помочь разобраться.
Вопрос №1:
AjaxForm имеет свои встроенные pop-up окна. Но я бы хотел выводить свой вариант pop-up окна. Я конечно мог бы повесить свои css стили на уже имеющиеся варианты, но все таки было бы лучше разобраться досконально. Как заставить AjaxForm при успешной отправке формы выводить мое сообщение с моими стилями?
Вопрос №2:
Как работает валидация? Она проверяет значения полей min-length или max-length? Как реально работают следующие строки:

&validate=`name:required,email:required,message:required`

?
Вопрос №3:
Из документации так и не понял, как научить AjaxForm добавлять css класс — error, при наличии ошибки валидации.
Перед написанием вопроса была изучена информация здесь
bezumkin.ru/sections/components/2070/
и здесь
docs.modx.pro/components/ajaxform

Егор Довгалюк

08 февраля 2016, 14:12

3 619

Комментарии: 7

Егор Довгалюк

08 февраля 2016, 21:00

Никто даже не натолкнет на мысль? :(

@ndrew

08 февраля 2016, 21:57

В вопросе №3
Вы привели ссылки там есть ответы на вопросы №1 и №3.

Вопрос №2
Параметр required, проверяет на то что бы поле было заполнено.
Соответственно name:required,email:required,message:required -> Имя, E-mail и Сообщение обязательны для заполнения.

Егор Довгалюк

08 февраля 2016, 22:31

Правильно ли я понял, этот код поможет мне при выводе правильных pop-up окон?

<?php
if (empty($_POST['name'])) {
    return $AjaxForm->error('Ошибки в форме', array(
        'name' => 'Вы не заполнили имя'
    ));
}
else {
    return $AjaxForm->success('Форма прошла проверку');
}

Максим Кузнецов

08 февраля 2016, 22:14

1. AjaxForm при выполнении регистрирует событие 'af_complete'. Следовательно, нужно повесить на него событие и проверить возвращаемый ответ:

$(document).on('af_complete', function(event, response) {
	if (response.form.attr('id') == 'айди_формы' && response.success == true) {
		//желаемый код алертов
	}
});

Но не стоит забывать, что это не отменит втроенный алерт из коробки. Т.е. желательно также добавить в вызов сниппета параметр &frontend_js, указывающий на кастомный скрипт обработки формы без вывода итогового алерта.

2. Валидация на уровне php выполняется сниппетом Formlt. (подробнее)

3. Это реализуется при помощи плейсхолдеров и дефолтных скриптов AjaxForm.

Егор Довгалюк

08 февраля 2016, 22:39

Спасибо! С пунктом 2 и 3 вроде все понятно. А вот первый первый пункт вгоняет в тоску, думаю, что придется начать не с события 'af_complete', а с покупки книги JS для начинающих)

Максим Кузнецов

08 февраля 2016, 22:46

Ну, знание js явно не будет лишним..)

С другой стороны, если вы хотите высветить алерт из какой-то произвольной библиотеки, то инициализировать его внутри вышеописанного кода не составит проблем. Если же вы хотите высветить свою стилизацию/текст при помощи идущего в комплекте с AjaxForm jGrowl, то его вызов тоже довольно легко воспринимается наитивно..)

Что же до удаления дефолтного алерта, то реализуется примерно так:
— копируем этот код в произвольный файл
— в вызове сниппета AjaxForm указываем при помощи настройки &frontend_js путь до свежесозданного файла
— в самом файле удаляем вот эту строку
(аналогичным способом можно также удалить другие типы алертов, избавляясь от строчек, начинающиеся с AjaxForm.Message)

Егор Довгалюк

08 февраля 2016, 23:42

Попробую разобраться, спасибо за развернутый комментарий!

Авторизуйтесь или зарегистрируйтесь, чтобы оставлять комментарии.

AjaxForm вывод своего pop-up, валидация форм.

Комментарии: 7

Здесь упомянуты