Руководство: Thymeleaf + Spring. Часть 2
Soft, интернет, безопасность: новости, статьи, советы, работа
Избранное сообщение
Фетісов В. С. Комп’ютерні технології в тестуванні. Навчально-методичний посібник. 2-ге видання, перероблене та доповнене / Мои публикации
В 10-х годах я принимал участие в программе Европейского Союза Tempus “Освітні вимірювання, адаптовані до стандартів ЄС”. В рамк.
понедельник, 28 января 2019 г.
Руководство: Thymeleaf + Spring. Часть 2 / Программирование на Java
5 Отображение Seed Starter Data
Первое, что покажет наша страница /WEB-INF/templates/seedstartermng.html, — это список с начальными стартовыми данными, которые в данный момент сохранены. Для этого нам потребуются некоторые внешние сообщения, а также некоторая работа выражений для атрибутов модели. Как это:
Здесь много чего посмотреть. Давайте посмотрим на каждый фрагмент отдельно.
Прежде всего, этот раздел будет отображаться только при наличии seed стартеров. Мы достигаем этого с помощью атрибута th:never и функции #lists.isEmpty(. ).
Обратите внимание, что все служебные объекты, такие как #lists, доступны в выражениях Spring EL так же, как и в выражениях OGNL в стандартном диалекте.
Следующее, что нужно увидеть, это много интернационализированных (экстернализованных) текстов, таких как:
List of Seed Starters
Это приложение Spring MVC, мы уже определили bean-компонент MessageSource в нашей конфигурации Spring (объекты MessageSource являются стандартным способом управления внешними текстами в Spring MVC):
… и это свойство basename указывает, что в нашем пути к классам у нас будут файлы, такие как Messages_es.properties или Messages_en.properties. Давайте посмотрим на испанскую версию:
В первом столбце таблицы мы покажем дату, когда был подготовлен стартер. Но мы покажем, что он отформатирован так, как мы определили в нашем DateFormatter. Для этого мы будем использовать синтаксис двойной скобки ($<<. >>), который будет автоматически применять сервис преобразования Spring, в том числе DateFormatter, который мы зарегистрировали при настройке.
Далее показано, покрыт ли начальный контейнер seed starter или нет, путем преобразования значения свойства булевого покрытого бина в интернационализированное «да» или «нет» с буквальным выражением подстановки:
Теперь мы должны показать тип начального seed starter контейнера. Тип представляет собой java-перечисление с двумя значениями (WOOD и PLASTIC), и поэтому мы определили два свойства в нашем файле Messages с именами seedstarter.type.WOOD и seedstarter.type.PLASTIC.
Но чтобы получить интернационализированные имена типов, нам нужно добавить seedstarter.type. префикс к значению enum с помощью выражения, результат которого мы затем будем использовать в качестве ключа сообщения:
Самая сложная часть этого списка — колонка фич. В нем мы хотим отобразить все функции нашего контейнера, которые представлены в виде массива перечислений Feature, разделенных запятыми. Как «Электрическое отопление, газон».
Обратите внимание, что это особенно сложно, потому что эти значения перечисления также должны быть выведены, как мы делали с Types. Поток вывода следующий:
- Подставьте соответствующий префикс ко всем элементам массива фич.
- Получите внешние сообщения, соответствующие всем ключам из шага 1.
- Присоедините все сообщения, полученные на шаге 2, используя запятую в качестве разделителя.
Для этого мы создаем следующий код:
Последний столбец нашего списка на самом деле будет довольно простым. Даже если у него есть вложенная таблица для отображения содержимого каждой строки в контейнере:
6 Создание Форм
6.1 Обработка командного объекта
Объект команды — это имя, которое Spring MVC дает бинам поддержки форм, то есть объектам, которые моделируют поля формы и предоставляют методы получения и установки, которые будут использоваться платформой для установления и получения значений, введенных пользователем в браузере.
Thymeleaf требует, чтобы вы указали объект команды, используя атрибут th:object в вашем теге
thymeleaf Начало работы с тимелеафом
замечания
Thymeleaf – это механизм шаблонов, библиотека, написанная в JAVA. Он позволяет разработчику определять шаблон страницы HTML, XHTML или HTML5, а затем заполнять его данными для создания конечной страницы. Поэтому реализует Model-View часть Model-View-Controller шаблон.
Важным принципом дизайна Тимелеафа является то, что сам шаблон должен быть правильно написан (X) HTML.
Версии
Представление формы Ajax с JQuery
Чтобы отправить форму через Ajax с помощью JQuery:
конфигурация
Чтобы начать работу с Thymeleaf, посетите официальную страницу загрузки .
Зависимость от Maven
Грейд-зависимость
Пример конфигурации
Начиная с версии 3.0, Thymeleaf поддерживает только конфигурацию Java.
В viewResolver() вы можете настроить, например, кодировку и тип содержимого для представлений. Дополнительная информация
В templateEngine() вы можете добавить специальные диалекты. Например, чтобы добавить engine.addDialect(new SpringSecurityDialect()); Spring Security, вы можете сделать это, как этот engine.addDialect(new SpringSecurityDialect());
Посмотрите на установщик для префикса и суффикса в методе templateResolver() . Он сообщает Тимелеафу, что каждый раз, когда контроллер вернет представление, Thymeleaf будет искать эти имена в html в каталоге webapp/views/ и добавлять к вам суффикс .html .
пример
Thymeleaf будет искать html с именем my-index.html в каталоге webapp/views/foo/ . В соответствии с приведенной выше конфигурацией.
Представление формы
Объект формы
контроллер
friendsForm.html
result.html
Замена фрагментов на ajax
Если вы хотите заменить части своего сайта, ajax – это простой способ сделать это.
На веб-сайте.html, где вы хотите заменить контент на основе выбранного значения:
И content.html с фрагментами, которые вы хотите включить, на основе выбранного значения:
И последнее, но не менее важное: Spring MVC ContentController.java :
Использование флажков
Пример метода в контроллере
Не используйте th:name для checboxes, просто name
Введение в Thymeleaf
В этой статье продолжим разбирать приложение из предыдущего примера. На этот раз сосредоточимся на синтаксисе шаблонов Thymeleaf. В пример будет добавлена проверка поля и вывод в шаблон ошибок.
Maven-зависимость
Чтобы добавить Thymeleaf в Spring Boot приложение, мы прописали в POM-файле зависимость:
Отображение атрибутов модели
На главной странице мы добавляли в модель два атрибута: animals и animal:
animals – коллекция, animal объект.
В шаблоне атрибуты становятся переменными, к которым есть доступ.
Вообще наша страница выглядит так:
Как выглядит страница на основе шаблона index.html
В шаблоне выводится коллекция animals. А перед ней находится форма, которая через заполненный animal отправляет введенное название животного в контроллер.
th:each – отображение коллекции
Начнем с коллекции animals. Мы ее выводим в виде таблицы:
$ – это обращение к переменной, содержащей коллекцию. Строка
Здесь an – текущее животное, iterStat – итератор.
Из него можно получить индекс:
а также, является ли индекс нечетным числом:
th:style – задание стиля
Если является, ты мы задаем строке стиль:
Так все нечетные строки будут выделены жирным шрифтом.
th:text – отображение текста внутри тега
Как вывести имя животного? Для этого есть очень популярный атрибут th:text:
Он заполняет тег значением из переменной.
Если название животного – “козел”, то вышеприведенная запись преобразуется на итоговой странице в:
Перейдем к форме.
Обработка формы: th:action, th:object, th:field
Форма у нас обрабатывается благодаря трем атрибутам:
где первый атрибут th:action задает адрес /, по которому идет POST-запрос с формы, второй – объект Animal, а третий – его поле name, которое заполняется и передается в контроллер. Обратите внимание, что переменная $ задана в th:object, поэтому имя поля прописывается со звездочки.
Форма преобразуется в итоге:
th:value
Но можно обойтись без th:object, в этом случае тегу прописываем атрибут th:value:
Разницы нет, в обоих случаях в теле POST-запроса уходит name=значение, а итоговый :
Проверка поля и вывод ошибок – th:errors
Добавим в код проверку корректности введенного значения имени и вывод ошибок. Для этого придется поменять код в нескольких местах.
Модель – @NotBlank и @Size(min=2, max=50)
Во-первых, добавим для поля name модели условие, при котором оно считается корректным:
То есть поле name должно быть не пустым (не состоять из пробелов) и иметь размер от 2 до 50.
Чтобы аннотации @NotBlank и@Size(min=2, max=50) компилировались и обрабатывались, необходимо добавить Maven-зависимость:
@Valid и BindingResult в контроллере
Во-вторых, исправим контроллер.
Значение name должно проверяться, когда Animal приходит в контроллер в метод add().
Чтобы это происходило, аннотируем animal с помощью @Valid, а следующим аргументом добавим BindingResult (порядок важен):
Теперь перенаправление (“redirect:/”) на get() делаем только в случае успеха, иначе же просто возвращаем index.html с ошибками. Модель тоже надо заполнять, чтобы не терять список уже добавленных животных.
th:errors – вывод ошибок
После всех приготовлений вывести ошибки просто. Просто добавим под тег:
В итоге при попытке добавить пустую строку получим:
Вывод ошибок
Итоги
Код примера доступен на GitHub. В нем добавлена проверка поля и вывод ошибок, касающихся этого поля.