Превращение вебформы в мастер заполнения с помощью jQuery
Очень свежая, нужная и весьма оригинальная идея - автоматически разбить форму на сайте с большим количеством полей на несколько форм, каждая из которых представляет собой логический шаг по заполнению.
Ниже приводим подробный урок, как это сделать с помощью jQuery.
Задача
Если вы по какой либо причине должны иметь на сайте большую форму для заполнения с большим количеством полей, то ее следует семантически разбить на отдельные группы полей (fieldsets). Каждая такая группа полей должна иметь четкое и ясное название. И хотя множество примеров в инете сегодня выглядят совершенно по разному, этому правилу все же надо стараться следовать.
Таким образом можно сказать, что каждая группа полей представляет собой подзадачу одной более большой задачи - заполнения вебформы. Следовательно, каждая подзадача может стать логическим шагом со своим названием (или описанием), полями ввода и навигацией “вперед” и “назад”, являющейся отличительной чертой мастера (визарда) заполнения форм. Весь процесс заполнения форм разбивается на несколько простых шагов.
Создаем “шаги”
Теперь поясним код, приведенный ниже. Чтобы определить, сколько должно быть шагов, нам необходимо выделить все группы полей (fieldsets) и получить размер этого набора групп полей. Затем мы проходим по этому набору (который возвращает как раз все группы полей), чтобы определить количество шагов. Каждую группу полей мы с помощью jQuery на лету помещаем в слой (div) и присоединяем к нему HTML элементы “параграф”(<p></p>), которые как раз и будут кнопками “веред” и “назад”.
Read more »
