Как реализовать подобный квиз?

Question

[vvanyazz]

Как правильно делать такое?

Comments

[Айрат]

Можете сказать конкретнее, с чем именно вам помочь?

[vvanyazz]

Айрат, я не знаю как выводить вопросы, делать разметку хтмл и потом менять блоки каждого шага или как-то делать через js разметку?

[Айрат]

я бы сверстал данные блоки через html, а на кнопки повесил обработчики, при клике на которые появляются следующие шаги

[vvanyazz]

Айрат, но в этом случае любой человек который хотть что-то понимает в хтмл через дев тулс сможет показать все шаги и например переступить на последний, как тут поступить?

[Айрат]

Ну человек ведь вас не взламывать пришел, а дверь покупать)

[IIIu6ko]

vvanyazz, А вы хотите генерировать разметку через JS? У вас ТЗ такое или сами придумали? Можно конечно и такое реализовать, но зачем?)
Я бы сделал подобный квиз из слайдера. Отключаешь ему все органы управления и листаешь по кликам на пункты...
И красиво и просто. Весь этот слайдер-квиз заворачиваешь в форму и вещаешь событие на submit с валидацией.
Тут собственно валидация только на инпут с телефоном нужна, чтобы человек полностью телефон заполнил. Плюс ещё маску можно повесит для телефона.

[vvanyazz]

IIIu6ko, я сам думал так делать, чтобы не было такого) https://pikabu.ru/story/ochered_na_gosuslugakh_8318123

[IIIu6ko]

vvanyazz, Тогда через JS вставляй просто готовую разметку
https://learn.javascript.ru/modifying-document#ins...

[ThunderCat]

vvanyazz,

чтобы не было такого

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

Вообще, квиз (блин какое долбанутое слово то...) - это викторина с правильными вариантами ответа, по которым проверяют уровень знаний игрока. У вас же это просто интерактивная анкета для подбора услуги, каким боком здесь викторина?

[vvanyazz]

ThunderCat, то есть делать эту анкету стоит просто через html?

[ThunderCat]

vvanyazz, имхо нечего особо городить огород, 3-4 формы, ну или сколько их там у вас, показывать их последовательно, сохранять результат в промежуточном объекте, по финалу отослать все на сервер, где уже провалидировать и записать.

Answer 1

[Сергей Кутузов]

На фриланс.

Comments

[vvanyazz]

ок