Введение в Java Server Faces

JSF (Java Server Faces) – это фреймворк для построения пользовательского интерфейса веб-приложений. JSF позволяет сочетать в себе использование компонентов UI с моделью на стороне сервера. Технология JSF является заменой JSP(Java Server Pages), недостатком которой было непонятное смешивания кода Java с описанием самих визуальных компонентов.

Для описания компонентов пользовательского интерфейса используется технология Facelets,  и создание пользовательского интерфейса на языке, основанном на XHTML.

Рассмотрим конкретный пример.

Для начала создайте новое Веб-приложение. В качестве сборщика я использовал Maven. Если вы работаете в IDE NetBeans, то создайте новый проект, выберите в списке Maven и нужный пункт.

maven_web

 

После структура проекта будет выглядеть примерно следующим образом:

web_project_structure

Чтобы создать новую страницу JSF, щелкните правой кнопкой  мыши на директории Веб-страницы и нажмите Новый -> Страница JSF (категория Web). В поле для ввода название наберите login.

Давайте представим форму, имеющую поле для ввода данных пользователя и имени с фамилией. После нажатия на кнопку Подтвердить пользователю показывается окно приветствия с его именем.

На языке Facelets разметка будет выглядеть следующим образом:

Разметка очень похожа на обычный HTML и разобраться в коде не должно составить большого труда. К слову, для описания страниц можно использовать и стандартные теги HTML.

Элементы <h:panelGrid>, <h:outputText>, <h:inputText> — это стандартные и одни из наиболее часто используемых компонентов визуального интерфейса.

<h:panelGrid> — таблица, имеющая количество столбцов, заданное свойством columns. В данном случае таблица имеет всего два столбца.

<h:outputText> — обычная текстовая метка(надпись)

<h:inputText> — текстовое поле для ввода данных.

Выражение #{user.name} относится к так называемому Языку Выражений(EL – Expression Language). Это дает возможность компонентам бизнес-логики, например, бинам EJB, обмениваться данными с компонентами визуального интерфейса. В данном случае свойство name относится к бину User, код которого приведен ниже:

Обратите внимание на то, что имя бина в выражении {#user.name} указано с маленькой буквы. Аннотация @ManagedBean означает создание управляемого бина-компонента JSF. Атрибут name устанавливает имя, по которому бин становится доступным при использовании EL-выражений.

Аннотация @SessionScoped предполагает существования объекта бина на протяжении всего сеанса с текущим клиентом.

Теперь создадим вторую страницу JSF, на которую мы попадаем, нажав на кнопку Ок. Эта страница просто будет содержать приветствие с введенным до этого именем. Создайте новую страницу JSF и назовите ее hello.xhtml. Код представлен ниже.

Теперь запускаем приложение и получаем следующий результат:

jsf_result

После нажатия на кнопку Ок выполняется переход на следующую страницу:

jsf_result_1

Поздравляем! Надеюсь вы успешно справились с предложенным примером, познакомились с технологией JSF и научились чему-то новому. В последующих статьях по JSF вас ждет тема валидации введенных данных и организация логических потоков Faces Flow! Следите за новостями!

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *