Статья Eclipse Corner

Учебники по WTP - Учебник по инструментам JavaServer Faces

Резюме
В данном учебнике мы скомпонуем и выполним приложение JavaServer Faces и уделим особое внимание функциям, которые предоставлены проектом инструментов JSF.

Рагу Шринивасан, Oracle Corporation.
15 июня 2009 г.


Введение

В этом учебнике мы создадим и выполним web-приложение с использованием возможностей JavaServer Faces. В проекте инструментов WTP JSF реализованы возможности, которые упрощают процессы построения, настройки и выполнения приложения. К их числу принадлежат Редактор веб-страниц для визуального редактирования веб-страниц JSF-JSP, синтаксической и семантической проверки страницы JSF-JSP и Редактор конфигурации Faces для редактирования файла ресурсов конфигурации приложения.

Перед работой с этим учебником вам может понадобиться ознакомиться с учебникомКомпоновка и выполнение веб-приложения. В нем описана настройка экземпляра сервера, которая не освещена в данном учебнике.

Настройка

Установите Редактор веб-страниц как редактор по умолчанию для страниц JSP

Редактор веб-страниц (WPE) проекта JSF Tools НЕ зарегистрирован как редактор по умолчанию для файлов JSP. Сделать WPE редактором по умолчанию для файлов JSP можно с помощью следующих действий:

Создайте проект JavaServer Faces

Создайте новое динамическое веб-приложение с именем JSFTutorial. Укажите Apache Tomcat 6.0 в качестве целевой среды выполнения
В разделе конфигурация выберите JavaServer Faces Project v1.2. Пропустите следующие две панели и перейдите к странице Возможности JSF.

Новое динамическое веб-приложение


На странице Возможности JSF из выпадающего списка Тип библиотеки JSF выберите Пользовательская библиотека.

страница Возможности JSF


Щелкните на значке Загрузить библиотеку. Появится окно диалога Загрузка библиотеки со списком провайдеров файлов JAR реализации JSF. Выберите библиотеку от Sun Microsystem. Нажмите Далее. Включите переключатель согласия с условиями лицензии и нажмите кнопку Готово

страница Возможности JSF


Этот инструмент загружает файлы JAR, создает пользовательскую библиотеку JDT и добавляет ее в текущий проект. Включите переключатель этой новой библиотеки, если он не включен. Теперь щелкните на значке Управлять библиотеками.

страница Возможности JSF



Создание пользовательской библиотеки JDT для файла JSTL jar. Нажмите кнопку OK.

страница Возможности JSF



В окне диалога Возможности JSF присутствует библиотека JSTL. Выберите библиотеку и нажмите кнопку Готово

страница Возможности JSF



Приложение JSF создано. Обратите внимание на то, что в файл web.xml добавлены сервлет Faces и элементы servlet-mapping, создан пример файла конфигурации приложения JSF (faces-config.xml), а в путь для компоновки добавлены jar-файлы реализации.



Если вы создали Динамическое веб-приложение ранее, то в него можно добавить возможности JSF с помощью команды меню:
Свойства проекта > Фасеты проекта > Добавить/удалить фасеты проекта…

Создайте страницу JSF JSP

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


Редактор веб-страниц


Откройте панель Свойства. Правой кнопкой мыши щелкните на холсте проектировщика и в контекстном меню выберите пункт Показать->Свойства. Дождитесь закрытия окна "Чтение свойств".

Добавьте на холст компонент CommandButton.


WPE-Добавление компонента CommandButton


Добавьте компонент PanelGrid
Измените компоненты, расположенные внутри Panel Grid


WPE-Добавление компонента
PanelGrid


В Структуре проектов разверните узел JSFTutorial->WebContent. Дважды щелкните на faces-config.xml . Эта команда запустит редактор конфигурации Faces. Выберите вкладку Управляемый объект.

Редактор конфигурации Faces - Управляемый объект

Нажмите кнопку Добавить. В результате откроется Мастер создания Управляемых объектов. Выберите опцию Создать класс Java. На следующей панели мастера укажитеcom.tutorial в качестве пакета и LoginBean в качестве имени класса. Нажмите кнопку Готово.

Создание Управляемого объекта

В результате будет создан класс Java, зарегистрированный как управляемый объект. Сохраните изменения в Редакторе конфигурации Faces. Для редактирования класса Java щелкните на гиперссылке Класс управляемого объекта на странице Управляемый объект, как показано на рисунке ниже. Эта команда запустит редактор Java.

Редактор конфигурации Faces - вкладка Управляемый объект


Измените класс Java com.tutorial.LoginBean. Добавьте следующий код и сохраните изменения.

LoginBean
В Структуре проектов щелкните правой кнопкой мыши на странице JSP login.jsp и в контекстном меню выберите опцию Проверить. Обратите внимание на то, что теперь страница не должна содержать ошибок.

На странице исходного текста Редактора веб-страниц добавьте тег JSF <h:inputSecret value="#{}"></h:inputSecret> . Оставляя курсор расположенным внутри скобок нажмите Ctrl+пробел . Вы увидите всплывающий список с перечислением всех явно указанных объектов, а также с указанием управляемого объекта, который был определен выше. Выберите управляемый объект loginBean

Проверка свойств объекта в EL

Введите имя свойства, например x, которое не определено в управляемом объекте, и сохраните изменения. Редактор покажет предупреждение о том, что невозможно распознать свойство.

Проверка свойств объекта в EL

Удалите недействительное свойство. Нажмите Ctrl+пробел после '.' в имени объекта. Вы увидите всплывающий список с перечислением свойств, определенных в управляемом объекте. Выберите из меню пункт password.

Помощник по работе с содержимым

Создайте класс Java com.tutorial.validatePassword, который реализует интерфейс Агент проверки, и сохраните его.

Агент проверки
В Структуре проектов разверните узел JSFTutorial->WebContent. Дважды щелкните на faces-config.xml . Эта команда запустит редактор файла faces-config. Перейдите к вкладке Компонент. Разверните раздел Агенты проверки.

Редактор конфигурации Faces - вкладка Компонент

Нажмите кнопку Добавить. Нажмите кнопку Обзор, связанную с полем Класс агента проверки, и выберите класс com.tutorial.ValidatePassword. Сохраните изменения.

Редактор конфигурации Faces - регистрация агента проверки

Добавьте тег JSF <f:validator id=""></f:validator > . Оставляя курсор расположенным внутри двойных кавычек нажмите Ctrl+пробел . Вы увидите всплывающий список с перечислением всех стандартных и зарегистрированных в файле faces-config агентов проверки. Выберите Проверить пароль .

Помощник по работе с содержимым для агентов проверки


Теперь мы переместим статические строки, использованные на странице, в комплект ресурсов. Для этого добавьте файл с именем messages.properties в папку com.tutorial . Определите свойства, как показано ниже, и сохраните файл.

Помощник по работе с содержимым для комплекта ресурсов

Добавьте тег JSF loadBundle, как показано ниже. Тег можно перенести из раздела Ядро JSF Панели палитры.

Помощник по работе с содержимым для комплекта ресурсов

Удалите строку Name в атрибуте value тега outputLabel. Расположите курсор в скобках и нажмите Ctrl+пробел . Вы увидите всплывающий список, в который включена переменная msg, определенная нами в теге loadBundle. Выберите ее.

Помощник по работе с содержимым для комплекта ресурсов

Введите точку после msg и нажмите Ctrl+пробел . Вы увидите всплывающий список с перечислением свойств, указанных в файле messages.properties. Выберите свойство name .

Помощник по работе с содержимым для комплекта ресурсов


Заполните страницу идентификации, как показано ниже.

Заполнение страницы идентификации

Создайте страницу JSF welcome.jsp, как показано ниже.

Заполнение страницы идентификации

Редактор ресурсов конфигурации Faces

В проекте инструментов JSF предусмотрен специальный редактор для файлов ресурсов конфигурации faces. В следующем разделе приведено краткое введение в Редактор. Скоро будет выпущен учебник с исчерпывающей информацией по всем функциям редактора.
Дважды щелкните на файле faces-config.xml для запуска Редактора конфигурации Faces. Перейдите на вкладку Навигация.

Редактор конфигурации Faces



Редактор конфигурации Faces

Тестирование страницы JSF JSP

1) Теперь мы запустим страницу с помощью сервера Apache Tomcat. Выделите в навигаторе страницу login.jsp и в контекстном меню выберите Запустить на сервере.



2) Выберите ваш сервер Apache Tomcat и настройте его требуемым образом, если вы не сделали этого ранее.

3) Нажмите кнопку Закончить. В панели Консоли вы увидите, что сервер Tomcat запускается, а затем в веб-обозревателе будет показана запущенная страница идентификации, как показано ниже.



Нажмите кнопку login. Вы перейдете на страницу welcome.


Поздравляем! Вы создали и выполнили свое первое приложение JavaServer Faces с помощью новых инструментов Eclipse WTP JSF.