Робимо вертикальні вкладки з описом, Blogpost
Починаючи із сьомої версії, в ядрі Drupal є підтримка т.зв. "Вертикальні вкладки" (або "Вертикальні Таби", "Vertical Tabs", як завгодно).
Їх створення і використання досить очевидні, як і весь FAPI 7-ки, і це не може не тішити.
Але, якщо подивитися на таби, отримані програмно і на ті, що нам надає ядро (на сторінках налаштування типів матеріалу або самих матеріалів тощо), можна побачити дещо модернізований їхній висновок. А саме - у них є свого роду субтайтл, або короткий опис, в якому міститься перелік налаштувань із вкладки.
У цьому посту подивимося як це реалізовано, і як ми можемо використати це у своїх проектах.
Для початку напишемо тестову форму з кількома вертикальними табами:
Зараз у нас є головний контейнер та 3 вертикальні вкладки. Також ми додали вкладкам атрибути, в яких вказали кожній свій клас. Трохи згодом розповім навіщо це нам.
Додамо трохи стандартних елементів форми у вкладці:
Тепер у нас є форма з табами і в кожному свої поля (налаштування).
Перейдемо до самої магії додавання короткого опису. Для цього нам потрібно підключити 2 js-файли:
- стандартнийform.js (у ньому оголошено jQuery-функціяdrupalGetSummary() необхідна для відображення субтайтлів);
- і свій - у якому робитимемо прив'язку.
Помістимо на початок форми:
Тепер відкриваємо скрипт нашого модуля та наповнюємо приблизно наступним вмістом:
Ось так - вже має працювати)).
І ось у цьому скрипті ми й використовували ті класи, які надали табам.