Зміна станів форми Drupal 7
Нерідкі ситуації, коли залежно від натискання елемента на формі з'являються/зникають/змінюються елементи цієї форми. І якщо для звичайних полів це можна зробити модулем conditional fields, то для своїх форм доведеться все писати самому. У Друпалі це можна зробити або черезajax (про це більш докладно можна почитати тут) або через параметр #states вForms API. І зараз мова піде саме про другий варіант.
Отже,#states. По суті, це PHP обгортка для найпростіших функційjQuery, які змінюють стан форми під час здійснення з нею заздалегідь заданих дій.
Стан елемента#states є асоціативним масивом такого виду:
Він складається з набору станів елемента, які можуть змінюватися при певних станах інших елементів сторінки (селектори можна вказувати для елементів за межами форми!). Найпростіший приклад:
Для любителів знати, як все працює
При додаванні до форми атрибута#states Друпал підключає бібліотеку з ядраdrupal.states (misc/states.js), а також додає до сторінки налаштування для подальшої обробки елементів. Для прикладу вище в коді сторінки можна знайти такий рядок:
Далі бібліотекаdrupal.states бере ці налаштування та виставляє подіїjQuery для вибраних селекторів.
Можливі значення станів
Список станів, які можуть бути використані до елемента:
- enabled - елемент буде доступним для змін через браузер.
- disabled - елемент буде недоступним для змін.
- required- елемент стане обов'язковим для заповнення.
- optional - елементстане необов'язковим для заповнення.
- visible - елемент буде показано.
- invisible - елемент буде прихований.
- checked - елемент буде відзначений (натиснутий).
- unchecked - з елемента знімається галочка натискання.
- expanded - елемент буде розгорнутий (для fieldset'ів).
- collapsed - елемент буде згорнутий (для fieldset'ів).
Список умовних станів, за яких елемент змінюватиме свій стан:
- empty- елемент порожній.
- filled- елемент не порожній.
- checked- елемент натиснутий.
- unchecked- елемент не натиснутий.
- expanded - елемент розгорнутий.
- collapsed - елемент згорнутий.
- value - елемент має значення значення.
Список станів, які можуть бути застосовані як до елемента, так і як умовний стан:
- relevant
- irrelevant
- valid
- invalid
- touched
- untouched
- readwrite
- readonly
Ті, хто знайомий зjQuery легко зрозуміють зміст перелічених станів. Ці атрибути не імплементовані повністю, тому роботи з ними в деяких випадках може не дати жодних результатів.
Відмінність перемикання станів форми через#states від роботи черезajax принципове - у першому випадку форма спочатку завантажується на сторінку вся, проте деякі її елементи показуються лише за певних умов. У той час як у роботі черезajax при завантаженні сторінки форми не містить зайвих елементів, вони підвантажуються динамічно, роблячи ajax запит іотримуючи відповідь від сервера.
На мій погляд, без крайньої необхідності використовуватиajax не варто. Не варто зайвий раз смикати сервер для завантаження кількох елементів форми, якщо це з яких-небудь причин не є нагальною потребою.
Відмінний приклад роботи з#states можна подивитися тут. Вихідники прикладу розташовуються тут.
Невеликий постскриптум.
Що далі розвивається Друпал, то ширші стають його межі. Я помітив, що останнім часом я все рідше використовую js в розробках, т.к. Друпал дозволяє робити більшість дій через PHP обгортки. Він сам підключає необхідні js файли і передає у параметри сторінки селектори, які сам потім правильним чином обробляє. Я задоволений :)