Генерация HTML-кода форм с помощью языка PHP
Генерация HTML-кода форм с помощью языка PHP
Построение формы с сохранением уже введённых значений — не такая уж простая задача, особенно если приходится иметь дело со списками значений для выбора или c полями, соответствующими массивам. Предлагаемые инструменты позволяют свести решение этой проблемы к описанию полей формы в виде простых конфигураций и подключению нужных HTML-шаблонов.
Состав пакета
В состав инструментария входят:
- функция для генерации данных полей (код доступен в виде отдельного PHP-файла)
- HTML-шаблоны полей (в виде архива)
- обработчик шаблонов (ему посвящена отдельная статья, в которой и опубликован его код)
Основные принципы составления конфигурации полей
Предположим, нужно получить вот такую форму:
Для этого потребуется следующий код PHP:
require_once 'make_form_data.php'; # Подключаем код функции
$cfg = array # Составляем конфигурацию полей
(
// первая группа
'short_note',
'longer_text',
'some_file',
'flag',
// вторая группа
'period' => array('values' => array(
'день',
'неделя',
'месяц',
'год',
)),
'shape' => array('values' => array(
'round' => 'круглый',
'square' => 'квадратный',
'triangle' => 'треугольный'
)),
'size' => array('values' => array(
array('value' => '', 'title' => '-- размер --'),
array('value' => 'small', 'title' => 'маленький'),
array('value' => 'medium', 'title' => 'средний'),
array('value' => 'big', 'title' => 'большой'),
)),
'color' => array('attr' => array('size' => 5), // число видимых элементов
// у <select>
'values' => array(
'black',
'white',
'red' => 'красный',
'blue' => 'синий',
array('value' => 'green', 'title' => 'зеленый')
)),
);
$FORMDATA = make_form_data($cfg, $_POST); # Генерируем данные полей
# с учетом параметров HTTP-запроса
# 2. Получаем HTML-код формы
require_once 'websun.php'; # Подключаем обработчик шаблонов
$HTML = websun_parse_template_path($FORMDATA, 'form.tpl'); # Подставляем данные
# в HTML-шаблон формы
С точки зрения составления конфигурации поля делятся на две группы:
-
Одиночные поля:
- <input type="text">
- <input type="checkbox">
- <textarea>
- <input type="file">
Составить конфигурацию для этих полей очень просто — надо всего лишь указать их имена1.
-
Списки значений для выбора. Значения перечисляются в параметре values, каждое из них может быть указано в формате array('value' => 'значение', 'title' => 'подпись'),
'значение' => 'подпись' или просто 'значение'. Такими полями являются:- набор <input type="radio">
- набор <input type="checkbox"> для выбора нескольких значений одновременно
- <select> и <select multiple>
В шаблоне формы каждому из полей соответствует запись вида {* + *имя* | шаблон *}:
Текст
{* + *short_note* | fields/input.tpl *}
Многострочный текст
{* + *longer_text* | fields/textarea.tpl *}
Загрузка файла
{* + *some_file* | fields/file.tpl *}
Флаг (вкл./выкл.)
{* + *flag* | fields/checkbox.tpl *}
Радиокнопки
{* + *period* | fields/radios.tpl *}
Выбор нескольких значений
{* + *shape* | fields/checkbox-multiple.tpl *}
Выпадающий список
{* + *size* | fields/select.tpl *}
Список с возможностьюодновременного выборанескольких значений
{* + *color* | fields/select-multiple.tpl *}
<button>Отправить</button>
</form>
Атрибуты полей
Случается, что полю нужно присвоить какой-то атрибут, будь то класс, стиль или текст-заглушка. Сделать это можно, включив в конфигурацию поля параметр attr, в котором нужные атрибуты следует перечислить в формате 'имя' => 'значение'2. Например, конфигурация
'attr' => array(
'placeholder' => 'пишите сюда',
'class' => 'special',
'style' => 'border: 2px solid #808080; padding: 2px',
),
)
в сочетании с шаблоном input.tpl даст:
type="text"
name="input_2"
value=""
placeholder="пишите сюда" class="special" style="border: 2px solid #808080; padding: 2px"
>
Значения атрибутов перед вставкой обрабатываются функцией htmlspecialchars().3
Поля, соответствующие ассоциативным массивам
Форма может содержать поля для указания нескольких значений одного и того же свойства, которые в HTTP-запросе удобно получать в виде ассоциативного подмассива.
Например, ограничение по цене удобно иметь в виде
(
[min] => ...
[max] => ...
)
Получить соответствующий набор полей можно, указав в конфигурации параметр keys:
'keys' => array('min', 'max'),
);
В массиве для подстановки в шаблон добавится уровень вложенности, и к полям нужно будет обращаться по ключам:
{* + *price.max* | fields/input.tpl *}
Бывает нужно дифференцировать отдельные поля, указав те или иные индивидуальные свойства. В этом случае элементы массива keys принимают формат описания конфигурации поля4. Например:
'keys' => array(
'min' => array(
'attr' => array(
'placeholder' => 'от',
),
),
'max' => array(
'attr' => array(
'placeholder' => 'до',
),
),
),
);
Ключей может быть более двух: 'keys' => array('min', 'max', 'avg', ...) и т.д.5
1. ▲ Сокращенной записи вида 'имя' соответствует полная форма 'имя' => array()
2.
▲
Атрибуты, которые обычно применяют без значений, указываются с дублированием:
'readonly' => 'readonly', 'disabled' => 'disabled' и т.п.
3. ▲ Это удобно, в частности, когда в качестве атрибута нужно использовать JSON. Например:
'class' => 'special',
'data-one' => '{"a":1,"b":2}',
'data-two' => '{"c":20,"d":30}',
)
4. ▲ При этом параметры, не указанные в элементе keys, наследуются от родительской конфигурации.
5. ▲ Вложенность ключей может быть многоуровневой:
'keys' => array(
'min',
'max' => array(
'keys' => array(
'deep',
'deeper' => array(
'keys' => array(
'very_deep',
...
),
),
),
),
),
)
© Все права на данную статью принадлежат порталу webew.ru. Перепечатка в интернет-изданиях разрешается только с указанием автора и прямой ссылки на оригинальную статью. Перепечатка в печатных изданиях допускается только с разрешения редакции.
