Как использовать логику?
Quasar form Pro имеет мощную встроенную условную логику. Вы можете использовать это для следующих задач:
Принцип работы логики
Логика работает по простой схеме, которая состоит из двух элементов — условия и действия.
1) Условие. Состоит из 2 или 3 частей в зависимости от типа условия.
Пример (двигайте ползунок):
В приведенной выше форме установлена следующая логика (скриншот):
Если значение ползунка станет больше 4, то будет показана скрытая кнопка «Отправить» (кнопка была скрыта, через настройки самого поля). Попробуйте — подвигать ползунок и сами все увидите.
2) Действие, вторая часть любой логики, может состоять из 3 и более значений в зависимости от типа действия. В форме приведенной выше — действие это показ кнопки.
В одной логики может быть много условий и много действий, обращенных к разным полям.
Например (выберите тип материала — Качественный и двигайте ползунок):
В приведенной выше форме установлено 2 логики (скриншот):
Первая логика имеет 2 условия и 2 действия, если значение ползунка больше 10 и в выпадающем списке «Материал» выбрано «Качественный» сработают действия первой логики — скрыть поле с выбором доставки и изменить текст в поле на «Вы получаете бесплатную доставку».
Для чего нужна вторая логика?
Все просто, не все действия имеют противоположный эффект. Например, действие показа или скрытия имеет противоположный эффект, если вы скрыли поле, но условие больше не выполняется, поле снова будет показано.
Но некоторые действия, такие как «изменить html», не имеют противоположного эффекта, текст меняется раз и на всегда, даже если условие больше не выполняется текст не вернется к исходному. Поэтому, чтобы вернуть исходный текст надо создать еще одну логику, которая и будет возвращать нужный текст, поэтому в форме выше 2 логики.
Действия, которые не имеют противоположного эффекта:
1) изменить html
2) установить значение поля
Для реализации сложных задач, можно использовать переменные значения. Типичный случай — надо сделать калькулятор, в котором скидка будет зависеть от значения одного из полей.
Данный функционал можно было сделать и без переменных, при помощи действия «пересчет итога калькулятора», однако переменные позволяют вам создавать более сложные формы. В форме выше всего одна логика (скриншот):
Сначала мы устанавливаем переменную — а со значением 0. Далее мы присваиваем переменной значение поля — количество карандашей, потом умножаем на три (изначально в калькуляторе умножается на 5, но нам нужна скидка в 2 рубля поэтому умножаем на 3). Далее используем действие для пересчета итога калькулятора, куда просто вставляем нашу переменную.
Обратите внимание — имя переменной в полях с действиями пишется в фигурных скобках.
Также знайте — при помощи действия «изменить значение переменной» можно калькулировать значения разных переменных, например:
1) Показать поле — показывает поле, если оно было скрыто. Имеет противоположный эффект. Если условие больше не выполняется, поле автоматически скрывается снова.
2) Скрыть поле — скрывает поле. Имеет противоположный эффект. Если условие больше не выполняется, поле автоматически отображается снова.
3) Изменить html в пользовательском тексте — изменяет текст или html в поле «Пользовательский текст / html». Работает только с этим типом полей. Не имеет обратного эффекта. Если условие больше не выполняется, исходное содержимое поля не восстанавливается.
Главная особенность этого поля — возможность использовать любые html теги.
4) Установить значение поля — устанавливает значение для поля. Не имеет обратного эффекта. Если условие больше не выполняется, исходное значение поля не восстанавливается.
5) Обнулить значение чекбокса — снимает все флажки у выбранного чекбокса. Пока условие выполняется задать значение данному чекбоксу будет нельзя.
6) Пересчитать итог калькулятора — пересчитывает значение поля «калькуляция». Работает только с этим типом поля. Эта логика может быть использована для реализации скидок, добавления в расчет новых полей или наоборот. Шорткод [itog] — это текущий итог калькулятора. Вы также можете использовать шорт коды с ID полей, как в формуле калькулятора.
Именно это действие позволяет вам создавать калькуляторы любой сложности — вы можете изменять формулу расчета на «лету».
Если условие больше не выполняется, то влияние этого поля для расчета исчезает. Пример реализации 20% скидки: [itog] — (( [itog] * 20) / 100 )
7) Добавить класс — добавляет класс указанному элементу. Главная особенность этого действия — оно не ограничено пределами формы, класс можно добавить любому элементу на странице. Если условие больше не выполняется, класс не пропадает.
Действие состоит из двух полей. В первом вы указываете селектор — класс или ID элемента, которому нужно добавить класс. Во втором поле указывается сам класс.
8) Удалить класс — тоже самое, что и добавить, но только удаляет класс, принцип работы тот же.
9) Cделать поле обязательным — сделать поле обязательным для заполнения. Обязательные поля нельзя пропустить. Данная функция помогает создавать квизы с несколькими ветками вопросов.
10) Сделать поле необязательным — сделать из обязательного поля необязательное.
11) Отключить отправку значения поля на почту — позволяет исключить поле и его значение из письма, которое вы получаете по электронной почте. Этот вариант подходит для квизов с несколькими ветками вопросов, чтобы не засорять письмо ненужной информацией.
12) Включить отправку значения поля на почту — аннулирует действие описанное выше.
13) Изменить значение переменной — позволяет установить значение переменной из других переменных. Значение может быть результатом вычисления нескольких переменных. Пример:
14) Присвоить переменной значение поля — установить значение переменной равным значению поля.
15) Скрыть таб — скрывает таб. Вы не можете переключиться на скрый таб. Обязательные поля на скрытой вкладке игнорируются.
16) Показать таб — показывает таб. Такой таб имеет статус обычного таба.
17) Переключить на таб — переключает форму на таб, указанный в данном действии. Чтобы переключиться на скрытую вкладку, сначала нужно ее показать. Также, если есть пустые обязательные поля, переключение не произойдет. При необходимости воспользуйтесь логикой отключения обязательного заполнения полей.
1) Работа с большим количеством полей
Количество селекторов(полей) в условиях и действиях не ограничено. Для работы с большим количеством полей не потребуется создавать много логик.
На скриншоте выше показано одно условие и одно действие, но работа происходит с большим количеством селекторов(полей). Когда используется несколько условий между ними ставится «и» или «или» — это значит оба условия должны быть выполнены или только одно из них. В действии мы также видим много полей, которые будут показаны.
2) Количество логик
Количество логик в одной форме ограниченно только вашей фантазией. Когда логик становится много, для удобного их просмотра используйте инструменты, показанные на скриншоте:
3) Фильтрация полей
Когда вы выбираете разные действия, то можете заметить, что список доступных полей, к которым можно применить это действие меняется.
Здесь все просто, при выборе действия происходит автоматическая фильтрация полей, остаются только поля, подходящие под это действие.
Не нашли ответа на свой вопрос? Напишите в поддержку:
Email: support@quasar-form.com
Вацап: 8 (937) 449-34-42
Соц. сеть: вк