Класс для построения сложных форм

В SKY-приложениях, класс `Form`, см. файл `main/w2/form.php`, используется для быстрого создания сложных форм. Подобные классы существуют во многих framework, они помогают значительно упростить рутинно-трудоемкий процесс создания больших и сложных форм. Абстрактная форма имеет очень много вариаций своего вида и поведения, и очень часто, в конкурирующих framework, используется достаточно сложный синтаксис для описания сложной формы. Мы не будем так делать, но следуя главному архитектурному принципу разработки в SKY, нам все-таки придется усложнить синтаксис, но грань сложного, мы все-же не перейдем, он останется прост.

Базовый синтаксис

Для описания форм, мы будем использовать иерархические возможности массивов PHP. Итак, общий подход: форма это массив, где ключами являются значения тега `name` HTML элементов ввода <input>, <select> и др. А значения массива - это массив с целочисленными индексами, где первым элементом есть название элемента формы, вторым элементом - тип элемента формы, назначение следующих за вторым элементом массива, зависят от типа элемента. Например:

001 002 003 004 005 006 007 008 009 010

$form = [     '<hr>',     'name' => ['Nickname'], # Nickname <input type="text" name="name" value="">     'who' => ['Sex', 'radio', ['male', 'female']],                # Sex <label><input type="radio" name="who" value="0" checked> male</label>                # и второй </label><input type="radio" name="who" value="1"> female</label>     ['send request', 'submit'], # <input type="submit" value="send request">     '<hr>', ];

Элементы формы рисуются на странице также как описано в примере сверху вниз. Страница условно поделена на две части - левую и правую. Названия элементов находятся слева а сами элементы справа.

Если в качестве элемента массива используется не строковый ключ (прототип тега `name`), значит тег name, будет отсутствовать в сгенерированом элементе, в примере выше смотрите кнопку 'submit'.

Если ключ целочисленный, а значение не массив, а строка или число, такой элемент будет добавлен в форму без преобразования. Например, см. выше отделение начала и конца формы тегом <hr>.

Последний вариант среди комбинаций в ключах и значения простых массивов, строк или других скаляров, это когда ключём является срока, а значением тоже строка или число, например 'hiddename' => 'hiddenvalue', является описание <input type="hidden" name="hiddename" value="hiddenvalue" >. Input типа hidden, можно описать как и все остальные элементы, например 'hiddename' => ['hiddenvalue', 'hidden', 'additional-properties'], однако форма выше позволяет упрощенно описывать Input теги типа `hidden`, ввиду того что комбинацию ключ - строка и значение строка или число (не массив) нужно приспособить к чему-то и это что-то, вероятно наилучшим образом подходит для таких описаний.

Горизонтальное размещение элементов

В примерах выше используется вертикальное размещение элементов формы, чтобы разместить элементы горизонтально, нужно использовать массив в массиве:

001 002 003 004 005 006 007 008

[[ // ... elements     ]], // OR     ['left direct string', [ // ... elements     ]],

Горизонтально, элементы размещаются в правой части холста, а в левую часть может быть помещена строка, которая отобразится без преобразования. Резонно сделать левую часть меньше правой и равной 38% или близко, а правую 62% (золотое сечение). Кроме того, чтобы разместить, влево и вправо строку без преобразований, можно воспользоваться статическим методом Form::X. Повторное использование "массив в массиве" ниже в иерархии, вернет вертикальное расположение элементов.

Валидация элементов формы

В классе Form имеется возможность создавать валидацию для элементов формы, которая может работать и на javascript и на PHP. Например чтобы принудить заполнить поле, для поля name элемента добвьте префикс +. Например: '+fio' => ...element. Чтобы создать валидацию по произвольному регулярному выражению, используйте префикс `/`. Полное описание RegExp и сообщение об ошибке описывается в массиве входящим в основной с ключем равным -1. В нем можно также и подменить дефолтное сообщение об ошибке, например "field can't be empty" на английском языке, на произвольное или на другом языке.

Условная валидация настраивается так: описываем radio input в форме, например:

001 002 003 004 005 006 007 008

<php -1 => [   'addr' => ['a2_zip', 'a2_house'] ] # ... form desc 'addr'   => ['Real address', 'radio', ['eq. to registered', 'neq.'], 0, 'onclick="return sky.f.slide(this,\'#sxd\')"'], # ... form desc

Выше `addr` - значение тега name radio input. `a2_zip`,`'a2_house` - значения тегов name области формы, для которой устанавливается условная валидация (начало и конец диапазона). Т.е. если часть формы скрыта с помощью style="display:none", часть формы не участвует ни в js ни в PHP валидации, если не скрыта - участвует.

Использование класса

С валидацией (полнофункционально), использование по схеме (или подобной):

001 002 003 004 005 006 007 008 009 010 011 012

function empty_a() {         $form = new Form($this->ary()); # прототип формы в конструктор         if ($_POST) {             $form->validate(); # если валидация на js прошла (есть запрос), делаем повторно на PHP             # insert / update ...             jump(true);         }           $this->_v = [             'form' => $form->def($_GET['id']),         ];     }

Без валидации:

001 002 003

<?php echo Form::A($row, $this->ary);

Кроме того имеются публичные методы класса:

string js(); # генерирует javascript код для js валидации

string tag($html); # генерирует тег <form>

string input($type, $val, $etc); # генерирует тег <input>

class xForm Form::X($cfg, $column1, ... more columns);

Метод Form::X позволяет делать на холсте (или его части) произвольное количество колонок для построения дизайна общей формы. Первый параметр, всегда - конфигурация, второй параметр (и возможно последующие) - колонка или колонки, описывающие часть формы, представленные в том же формате, что и основная форма. Можно считать, что в то место куда вставлен метод Form::X в основной форме (или под-форме) попадет сгенерированная строка, хотя на этапе описания формы, метод возвратит объект xForm. Если количество колонок больше двух, колонки всегда будут "обернуты" тегом <table>. Если 1-2 могут быть описаны стандартным шаблоном TPL_FORM (на основе тега <dl>). Если конфигурация не нужна, первым параметром необходимо вставить пустой массив - []. Конфигурация может быть:

001 002 003 004 005 006 007

<php $cfg = [     'etc' => 'id="my-table"', # свойства для таблицы или <div>     'opt' => Form::OPT_TABLE | Form::OPT_DIV # обернуть все в <div> или в таблицу     'width="10%"' # установить для тега <td> таблицы ширину (можно любые свойства тега)     'style="background:red"' # для второй колонки установить красный фон (индекс массива $cfg == 1) ];

Form::X позволяет вставлять под-формы в основную форму, при этом в конфигурации "под-формы" можно изменить значения ключей элементов или вставить более одного раза элементы с тегом name - массивом, например name="id[]". Ключи массивов PHP должны быть уникальны и не позволили бы это сделать без Form::X.

Пример использования класса можно посмотреть здесь. По остальным вопросам смотрите код класса.