Как создать форму ввода данных на сайте?

Question

[Александр Сергеевич]

Здравствуйте, уважаемые обыватели форума.
Начал постигать основы вертки и напоролся на такой вот камень.
Понимаю, что этот вопрос возник лишь от недостатка опыта и знаний, поэтому прошу посоветовать гайды и статьи по теме.
Суть вопроса такова. Нужно создать такие вот блоки:

Форма ввода данных, которая, при нажатии на кнопку "get result", перенаправляет на другую страницу с окном вывода результата (результат выводится в процентах, и зависит от введенных значений).
Еще есть пожелание, чтобы значение в форму "chose age" можно было вводить как с помощью ползунка, так и с помощью простого вписания в поле.
Прошу советов в решении этого вопроса.
Спасибо.

Answer 1

[Арсений Матыцин]

Form, внутри которой input type checkbox\radiobutton (выбор да нет) + range (для ползунка) и кнопка либо button, либо input type submit.

И кастомизировать внешний вид + немного JS, чтобы ползунок при вводе показывал текущее значение. Из коробки HTML так не умеет.

Answer 2

[Артур]

bootstrap col-md-4 col-md-4 col-md-4 - три блока в ряд
на radio checkbox поставь смену центрального блока (ползунок блок или input)
на кнопку - ajax отправку данных + переброску на стр результата

по ползунку для jq есть готовые решения вида ion.rangeSlider.js

Answer 3

[Kirill Makarov]

Из JavaScript как вариант закидывать значение ползунка в localstorage, погугли думаю проблем не будет.