Java Server Faces предоставил компонентную архитектуру для создания компонентов пользовательского интерфейса для веб-приложения. Цель Ajax — обеспечить более быстрый отклик клиентским приложениям путем перезагрузки только необходимых данных. Было бы неплохо использовать преимущества Jsf и Ajax для разработки надежных веб-приложений. Ajax4Jsf предоставляет решение для этого. Это интеграция Java Server Faces с Ajax (что означает асинхронный JavaScript и Xml), тем самым обеспечивая поддержку Ajax для компонентов пользовательского интерфейса Jsf. В этой статье делается попытка дать обзор Ajax4Jsf Framework, который теперь является проектом с открытым исходным кодом в сообществе JBoss.
- Введение в Ajax4Jsf
- Изучение библиотеки Ajax4Jsf
- Пример приложения на Ajax4Jsf
2) Что такое Ajax4Jsf?
Перед тем, как попробовать Ajax4Jsf, полезно узнать о различных технологиях, на которых построен Ajax4Jsf. Из названия самой платформы следует понимать, что в нее встроены Ajax (асинхронный JavaScript и Xml) и Jsf (Java Server Faces), две наиболее популярные технологии. Давайте сначала посмотрим на эти две технологии, прежде чем углубляться в Ajax4Jsf.
Java Server Faces предоставляет компонентную платформу для управления и разработки компонентов пользовательского интерфейса в веб-приложении. Он также предоставляет богатый набор функциональных возможностей, который включает в себя обработку событий, настройку механизма навигации по страницам, проверку клиентских данных, преобразование данных и т. Д. Он также предоставляет подключаемую архитектуру, в которой разработчики могут разрабатывать свои собственные компоненты пользовательского интерфейса и легко подключаться к Framework. , Одной из основных особенностей Jsf Framework является то, что он не предназначен для одного типа клиентов. Это означает, что помимо Html Browser Clients для рабочего стола, можно даже иметь Wml Browser Clients для мобильных телефонов.
Ajax, который обозначает асинхронный JavaScript и Xml, не нов. Более умный способ использования существующих стандартов / технологий, таких как JavaScript, Xml и Html, породил Ajax. Используя Ajax, код JavaScript может напрямую взаимодействовать с серверной частью. Данные запроса и ответа между клиентом и сервером обмениваются в формате XML. Одним из основных преимуществ использования Ajax является то, что он ускоряет производительность веб-приложения, загружая только часть рассматриваемой веб-страницы, тем самым обеспечивая лучшие результаты. Для получения дополнительной информации и приложений Ajax, обратитесь http://jsf.javabeat.net/articles/2007/06/ajax-functionality-in-custom-java-server-faces-component .
Теперь пришло время взглянуть на Ajax4Jsf. Как можно было бы догадаться, Ajax4Jsf — это платформа, которая при включении в веб-приложение добавит поддержку Ajax для компонентов Jsf. Поскольку Jsf является компонентно-ориентированной средой, легко создать дополнительные компоненты, обеспечивающие поддержку Ajax для страниц Jsf. Итак, все Компоненты в Библиотеке Ajax4Jsf являются не чем иным, как расширением Компонентов Jsf. Прозрачное использование Java Script Code вместе с Xml Http Request Objects будет обеспечиваться самой платформой, что означает, что разработчику не нужно смешивать Java Script Code в их приложении. Давайте подробно рассмотрим внутреннюю структуру Ajax4Jsf Framework в следующем разделе.
3) Ajax4Jsf Internals
Прежде чем рассматривать внутренние компоненты Ajax4Jsf, давайте кратко рассмотрим архитектуру Jsf. Стоит сначала изучить архитектуру Jsf, прежде чем углубляться в детали.
В Java Server Faces всякий раз, когда Клиент делает запрос, приходит к ресурсу, он перехватывается сервлетом Faces (как представлено javax.faces.webapp.FacesServlet). Этот сервлет будет выполнять запрос клиента, который будет проходить через шесть различных этапов жизненного цикла, таких как этап восстановления представления, применение значений запроса, проверка входных данных пользователя, обновление объектов модели, выполнение приложения и, наконец, рендеринг ответа. Ajax4Jsf — это инфраструктура, которая добавляет поддержку существующего приложения Jsf. Фактически Ajax4Jsf Framework реализован в виде фильтра, тем самым добавляя функцию JavaScript и зависимости XmlHttpObject к существующим компонентам Jsf. Но когда запрос является запросом Ajax4Jsf, все меняется. Специально, когда Запрос сделан Пользователем,запускается событие Java Script Event, которое обрабатывается механизмом Ajax, который обычно находится на стороне клиента. Теперь работа Ajax Engine заключается в том, чтобы отправить исходный запрос Ajax4Jsf, что означает, что запрос будет перехвачен фильтром Ajax4Jsf. Затем преобразование данных в формат Xml будет проходить здесь через различные фильтры Xml, после чего запрос перенаправляется в исходный сервлет Faces, в результате чего запрос проходит несколько этапов.Затем преобразование данных в формат Xml будет проходить здесь через различные фильтры Xml, после чего запрос перенаправляется в исходный сервлет Faces, в результате чего запрос проходит несколько этапов.Затем преобразование данных в формат Xml будет проходить здесь через различные фильтры Xml, после чего запрос перенаправляется в исходный сервлет Faces, в результате чего запрос проходит несколько этапов.
В Ajax4Jsf Framework существуют так называемые Ajax-контейнеры, которые представляют Дерево компонентов вместе со значениями запросов, которые кодируются и декодируются во время Ajax-запросов и ответов. Именно из-за доступности Ajax Engine в клиенте возможно обновление части областей на веб-странице.
4) Изучение библиотеки Ajax4Jsf
Этот раздел посвящен поиску тегов Ajax4Jsf для различных функциональных возможностей. Большинство тегов в этой библиотеке предоставляют альтернативные средства для представления той же функциональности, что и теги Jsf. Любой из двух тегов может быть использован в такой ситуации. Трудно классифицировать набор тегов на основе функциональных возможностей, и в следующих разделах делается попытка дать краткое описание наиболее часто используемых тегов, а также некоторые примеры фрагментов.
4.1) Тег региона
Не все данные клиента на странице нужны серверу для обработки. В большинстве случаев для обработки этого конкретного запроса достаточно только данных из части страницы. Вот тут-то и появляется тег Ajax Region Tag. Это своего рода тег контейнера, означающий, что он может содержать теги другого типа. Когда компоненты определены в этом теге, только значения этих компонентов обрабатываются на стороне сервера при выполнении запроса Ajax.
По умолчанию, если на странице JSP нет определения тега региона, вся страница JSP будет считаться регионом Ajax. Возможно также использование нескольких тегов регионов на одной странице.
Следующий фрагмент кода показывает использование этого тега:
<a4j:region id = "employeeRegion" actionListener = "#{manager.processEmpData}">
<!-- Other Set of Components -->
</a4:region>
<a4j:region id = "stockRegion" actionListener = "#{manager.processStockData}">
<!-- Other Set of Components -->
</a4:region>
В приведенном выше коде мы определили две области, одна из которых является employeeRegion, а другая — stockRegion. Всякий раз, когда делается запрос Ajax для «employeeRegion» (или «stockRegion»), часть данных, доступных только с «employeeRegion», будет отправляться на сервер (метод Manager. ProcessEmpData ()) для обработки.
4.2) Тег командной кнопки.
Он представляет собой компонент кнопки и может использоваться для запуска событий действий на сервере. Это очень похоже на тег кнопки команды Jsf, но вместо генерации запроса Jsf при нажатии кнопки будет сгенерирован запрос Ajax, который будет перехвачен механизмом Ajax. Существует полезный атрибут «oncomplete», который может содержать код JavaScript или функцию JavaScript, которая будет выполняться, как только ответ придет с сервера.
Все события, такие как события изменения, ключевые события, события мыши и т. Д., Применимы к этому тегу благодаря использованию различных атрибутов. Свойство reRender будет принимать разделенный запятыми список Идентификатора компонента, который будет перерисован, как только управление вернется с Сервера обратно к Клиенту.
Ниже приведен фрагмент кода, демонстрирующий использование тега Command Button:
<a4j:commandButton id = "clickButton" value = "Click Me"
action = "#{Listener.processClickRequest}" oncomplete = "jsFunction()">
reRender = "CompId1, CompId2, CompId3"
</a4j:commandButton>
В приведенном выше коде всякий раз, когда активируется кнопка со значением «Click Me», вызывается метод processClickRequest () в классе Listener. После этого Компоненты, представленные идентификаторами компонентов (CompId1, CompId2 и CompId3), получат обновленное значение с сервера. Затем, наконец, будет вызвана функция Java Script jsFunction (), как указано в атрибуте «oncomplete».
4.3) Тег Командной Связи
Нет большой разницы между Командной Кнопкой и Командной Связью, кроме их представления, поскольку оба демонстрируют форму Компонентов Действия. Все свойства, применимые к командной кнопке, применимы и к командной ссылке.
Следующий фрагмент кода показывает использование этого компонента:
<a4:commandLink id = "myLink" value = "This is my Link"
action = "Listener.processMyLink">
</a4:commandLink>
4.4) Тэг вывода мультимедиа
В то время как тэг вывода текста используется для заливки нормального содержимого символов, этот тег используется для визуализации Rich Contents на клиенте в форме изображений, аудио или видео. Чтобы достичь этого, атрибут ‘createContent’ должен предоставлять метод, который принимает два аргумента типа java.io.OuputStream и java.lang.Object. Ниже приводится использование для того же:
<a4j:mediaOutput id = "telephone" element = "img" mimeTye = "image/png"
createContent = "#{ImagePainter.drawImage}">
</a4j:mediaOutput>
В приведенном выше фрагменте кода, атрибут «элемент» может принимать эти возможные наборы значений («якорь», «изображение», «объект», «апплет»), который представляет имя элемента HTML, который должен использоваться для визуализации этого образ. Обратите внимание, что mimeType указывает на файл image / png, так как мы собираемся создать массив байтов из файла изображения типа png. Учитывая атрибут ‘createContent’, он принимает выражение Jsf EL, метод которого принимает в качестве аргументов OutputStream и Object. Ниже приведен код для того же:
ImagePainter.java
package net.javabeat.articles.ajax4jsf.introduction;
import java.io.*;
public class ImagePainter {
private String fileName = "telephone.png";
public void drawImage (OutputStream output, Object object) throws IOException{
File file = new File(fileName);
byte byteArray[] = new byte[1000];
FileInputStream inputStream = new FileInputStream(file);
while(true){
try{
int bytesRead = inputStream.read(byteArray);
output.write(byteArray, 0, bytesRead);
}finally{
if (inputStream != null){
inputStream.close();
}
}
}
}
}
Обратите внимание, что объект OutputStream, который передается в качестве аргумента методу drawImage (), должен быть заполнен байтовым массивом, указывающим на ресурс изображения.
4.5) Сохранение живого тега
Предположим, что управляемый компонент компонента был объявлен с областью действия «Запрос» в файле конфигурации с помощью тега <managed-bean-scope>. Тогда время жизни этого объекта Bean действительно только для текущего запроса. Любая попытка сделать ссылку на объект Bean после завершения запроса приведет к возникновению исключения недопустимого аргумента сервером, поскольку объект Bean теперь недопустим.
Чтобы избежать возникновения подобных исключений, мы можем зависеть от тега Keep Alive, который используется для поддержания состояния объекта Whole Bean в последующих запросах. Ниже приведен фрагмент кода для того же:
<a4j:keepAlive beanName = "#{manager.empBean}">
</a4j:keepAlive>
Обратите внимание, что атрибут должен указывать на допустимое выражение Jsf EL, которое разрешается в экземпляр управляемого компонента. Например, для приведенного выше кода определение класса может выглядеть следующим образом:
Manager.java
class Manager{
private EmployeeBean empBean;
// Getters and Setters for empBean.
}
4.6) Повторить тег
В теге реализована базовая операция итерации, и, как правило, предпочтительно отображать набор объектов, найденных в коллекции. Это очень похоже на функциональность, доступную в компоненте <h: dataTable>. Ниже приведен сценарий использования этого тега.
<a4j:repeat id = "repeater" value = "#{manager.empList}" var = "employee">
<h:outputText id = "name" value = "#{employee.name}"/>
<h:outputText id = "age" value = "#{employee.age}"/>
</a4:repeat>
Предположим, что у нас есть класс с именем Manager, который представляет коллекцию объектов Employee, содержащих два свойства, а именно имя и возраст. Ниже приводится структура класса менеджера.
Manager.java
public class Manager{
private List<Employee> employees;
// Getters and setters for employees;
}
Employee.java
public class Employee{
private String name;
private int age;
// Getters and Setters for name and age
}
Если предположим, что мы хотим отобразить список сотрудников на странице, то мы можем использовать тег повторения. Атрибут ‘value’ в теге обычно представляет коллекцию, а атрибут ‘var’ может содержать элемент из объекта Collection. Этот тег тождественно эквивалентен циклу for.
for (Employee employee : manager.getEmployees() ){
display(employee.getName());
display(employee.getAge());
}
4.7) Метка опроса Метка
опроса используется для автоматического обновления текущей страницы путем отправки периодического запроса на сервер через регулярные интервалы путем отправки формы. Это может использоваться на страницах, где представление должно предоставлять актуальную информацию, такую как стоимость акций, результаты крикета и т. Д. Ниже приведен фрагмент кода, демонстрирующий этот тег.
<a4j:poll id = "refreshId" reRender = "CompId1, CompId2" timeout = "50000"
interval = "1000">
</a4j:poll>
В приведенном выше, страница будет обновляться автоматически через каждую 1 секунду (как указано в атрибуте ‘interval’). Обратите внимание, что для атрибута timeout установлено значение 50 секунд, что означает, что через 50 секунд страница перестанет автоматически обновляться. Список компонентов, подлежащих повторной визуализации, указывается в атрибуте reRender.
4.8) Метка статуса Метка
статуса может использоваться как своего рода Индикация для Клиента о текущем статусе запроса, например, обрабатывается ли запрос сервером или запрос был обработан. Ниже приведен пример кода, иллюстрирующий то же самое,
<a4j:status startText = "Request sent to the Server" stopText = "Request is completed">
</a4j:status>
В вышеприведенном случае, когда Клиент инициирует Запрос, тогда сообщение «Запрос отправлено на Сервер» (как представлено атрибутом «startText») отображается до тех пор, пока Запрос не будет полностью обработан, и в этом случае сообщение «Запрос завершен» (как представлен атрибутом «stopText»).
4.9) Тег поддержки
Наиболее часто используемый тег в библиотеке Ajax4Jsf — это поддержка, которая обеспечивает поддержку Ajax для компонентов Jsf. Он всегда отображается как дочерний тег для различных компонентов Jsf. Следующий список обеспечивает использование этого тега,
<a4j:inputText id = "userInput">
<a4j:support event = 'onblur' action = "#{bean.process}"
binding = "bean.userInput" reRender = "CompId1, CompId2"/>
</a4j:inputText>
In the above sample, whenever the focus is lost for the user input text Field Component, and then the corresponding process method in the Bean class will be invoked. The ‘reRender’ attribute defines a list of components whose values are to be updates once the request is over. Note the usage of the ‘binding’ attribute. This attribute resolves to an EL Expressing which maps to the UIInput Control of the Component represented by userInput. Following is the structure in which the Bean class may look like,
Bean.java
public class Bean{
private UIInput userInput;
//Getters and Setters
}
5) Sample Application
5.1) Introduction
In this section, let us walk through a Sample Application that makes use of the Ajax4Jsf Libraries. Let the keep the functionalities of this Sample Application to a simpler extent. This is a kind of Auto Complete Application in which whenever the User gives the Bank Account Number, the corresponding details like the name of the Bank, its Branch Name, Customer Name, Balance Details, Contact Details etc will be fetched from the Server. The more important thing to note that is the Request that is sent to the Server is not a normal Jsf Request but instead it is a Ajax Request.
5.2) Web Application Descriptor File
As seen previously, the Ajax4Jsf provides a Filter Servlet for adding Ajax capability for the Jsf Components. So, the web.xml should include a ‘filter’ tag about the various information about the Filter Servlet.
web.xml
<?xml version="1.0" encoding="UTF-8"?>
<web-app version="2.5" xmlns="http://java.sun.com/xml/ns/javaee"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://java.sun.com/xml/ns/javaee
http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd">
<filter>
<display-name>Ajax4jsf Filter</display-name>
<filter-name>ajax4jsf</filter-name>
<filter-class>org.ajax4jsf.Filter</filter-class>
</filter>
<filter-mapping>
<filter-name>ajax4jsf</filter-name>
<servlet-name>Faces Servlet</servlet-name>
<dispatcher>REQUEST</dispatcher>
<dispatcher>FORWARD</dispatcher>
<dispatcher>INCLUDE</dispatcher>
</filter-mapping>
<servlet>
<servlet-name>Faces Servlet</servlet-name>
<servlet-class>javax.faces.webapp.FacesServlet</servlet-class>
<load-on-startup>1</load-on-startup>
</servlet>
<servlet-mapping>
<servlet-name>Faces Servlet</servlet-name>
<url-pattern>/faces/*</url-pattern>
</servlet-mapping>
<session-config>
<session-timeout>30</session-timeout>
</session-config>
<!-- Welcome files -->
<welcome-file-list>
<welcome-file>index.html</welcome-file>
</welcome-file-list>
</web-app>
As we can see from the above Xml File, apart from the normal Faces Servlet information, a Filter Servlet has been embedded to add Ajax capabilities for the Client Requests.
5.3) Faces Configuration File
The Faces Configuration file (faces-config.xml) contains only one entry that represents a Managed Bean object. As we will see in the later sections, this Managed Bean will contain the logic for creating some Dummy Account Information as well as contains the logic for fetching the appropriate Account Information. Following is the code for faces-config.xml file.
faces-config.xml
<?xml version="1.0" encoding="UTF-8"?>
<faces-config version="1.2" xmlns="http://java.sun.com/xml/ns/javaee"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://java.sun.com/xml/ns/javaee
http://java.sun.com/xml/ns/javaee/web-facesconfig_1_2.xsd">
<managed-bean>
<managed-bean-name>accountSearcher</managed-bean-name>
<managed-bean-class>
net.javabeat.articles.ajax4jsf.introduction.AccountSearcher
</managed-bean-class>
<managed-bean-scope>session</managed-bean-scope>
</managed-bean>
</faces-config>
5.4) Jsp File containing Jsf and Ajax4Jsf Tags
The following Jsp page presents an Interface to the user, when the User is given a Text-Field prompting to enter the Account Information. If the Account Number entered in valid, which is done by comparing the list of Account Objects, then the corresponding related Information of the Account will be populated in the View.
index.jsp
<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h" %>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f"%>
<%@ taglib uri="https://ajax4jsf.dev.java.net/ajax" prefix="a4j" %>
Enter the Account number and tab out for getting further information
The main thing to observe in the Jsp Page is for the <a4j:support> tag which is embedded within the <h:inputText> tag representing the Account Number. Since we want support for the Account Number Text-Field we have done like this. That’s all, just by adding this support Tag within the Jsf UI Components, automatically Ajax Support will be applicable to the JSF UI Components. The attribute ‘event’ is set to ‘onblur’ which means that the corresponding listener method as represented by the ‘actionListener’ attribute (search() defined inside the AccountSearcher class) will be called when the focus is lost from the Text Field control (which means after tabbing out from the Control). The most significant attribute is the support tag is the ‘reRender’ attribute which takes a comma separated list of Component Identifiers that want to be re-rendered once the control returns back from the Server.
The ‘binding’ attribute evaluates to a Jsf EL Expression, if specified will map to the corresponding UI Component in the Backing Bean Class. For example, consider the following code snippet,
<h:inputText id = "AccountNo" binding = "#{accountSearcher.accountTextField}">
</h:inputText>
The binding expression is given as «#{accountSearcher.accountTextField}, which means that the Input Control directly maps to a property by name accountTextField in the AccountSearcher class which is of type javax.faces.component.UIInput. Following is the Java Code for the same,
AccountSearcher.java
public class AccountSearcher {
private UIInput accountTextField;
// Getters and Setters for the same.
}
5.5) Account.java
Following is the class that encapsulates pieces of information like Account Number, Bank Name, Customer Name, Branch Name, Account Opening Date, Contact Information inside the Account class. Following is the complete Listing for the Account.java class.
Account.java
package net.javabeat.articles.ajax4jsf.introduction;
import java.util.Date;
public class Account {
private long accountNo;
private String bankName;
private String customerName;
private String branchName;
private String openDate;
private double closingBalance;
private String address;
private String emailId;
private String phoneNumber;
public Account() {
}
public long getAccountNo() {
return accountNo;
}
public void setAccountNo(long accountNo) {
this.accountNo = accountNo;
}
public String getBankName() {
return bankName;
}
public void setBankName(String bankName) {
this.bankName = bankName;
}
public String getCustomerName() {
return customerName;
}
public void setCustomerName(String customerName) {
this.customerName = customerName;
}
public String getAddress() {
return address;
}
public void setAddress(String address) {
this.address = address;
}
public String getEmailId() {
return emailId;
}
public void setEmailId(String emailId) {
this.emailId = emailId;
}
public String getBranchName() {
return branchName;
}
public void setBranchName(String branchName) {
this.branchName = branchName;
}
public String getOpenDate() {
return openDate;
}
public void setOpenDate(String openDate) {
this.openDate = openDate;
}
public double getClosingBalance() {
return closingBalance;
}
public void setClosingBalance(double closingBalance) {
this.closingBalance = closingBalance;
}
public String getPhoneNumber() {
return phoneNumber;
}
public void setPhoneNumber(String phoneNumber) {
this.phoneNumber = phoneNumber;
}
}
5.6) AccountCreator.java
This Utility Class is used to create Dummy Account Information Objects and acts as Storage for those Account Objects. When looked-up for an Account object by giving the Account Number as a Key, the appropriate Object is returned. The Managed Bean references this Class heavily for creating and retrieving Account Objects. Following listing is the complete code for AccountCreator.java
AccountCreator.java
package net.javabeat.articles.ajax4jsf.introduction;
import java.util.HashMap;
import java.util.Map;
public class AccountCreator {
private static Map<Long, Account> accounts;
public static void createTestAccounts(){
if (accounts == null || accounts.isEmpty()){
accounts = new HashMap<Long, Account>();
}
Account account = null;
account = createAccountInfo(123456, "Hdfc Bank",
"Jenny", "Shastri Nagar, Chennai",
"10/05/2003", 100033.53, "Address1",
"[email protected]", "99123456789");
accounts.put(account.getAccountNo(), account);
account = createAccountInfo(234567, "Icici Bank",
"Joseph", "Besant Nagar, Chennai",
"121/09/2001", 3200033.53, "Address2",
"[email protected]", "99987654321");
accounts.put(account.getAccountNo(), account);
}
private static Account createAccountInfo(long accountNo, String bankName,
String customerName, String branchName, String openDate,
double closingBalance, String address, String emailId, String phoneNumber){
Account account = new Account();
account.setAccountNo(accountNo);
account.setBankName(bankName);
account.setCustomerName(customerName);
account.setBranchName(branchName);
account.setOpenDate(openDate);
account.setClosingBalance(closingBalance);
account.setAddress(address);
account.setEmailId(emailId);
account.setPhoneNumber(phoneNumber);
return account;
}
public static Account getAccountInfo(Long accountNo){
return accounts.get(accountNo);
}
}
5.7) Account Searcher.java
This Managed Bean takes care of creating Dummy Account Objects and it returns the appropriate Account Information back to the Client upon Request. Most of the code in this class represents the getters and the setters for the various UI Components in the Jsp Page. The search logic is implemented in the search() method which takes ActionEvent as its only parameter. Following is the code for the same.
AccountSearcher.java
package net.javabeat.articles.ajax4jsf.introduction;
import javax.faces.component.UICommand;
import javax.faces.component.UIComponent;
import javax.faces.component.UIInput;
import javax.faces.context.FacesContext;
import javax.faces.event.ActionEvent;
public class AccountSearcher {
private Account account;
private UIInput accountTextField;
private UIInput bankNameTextField;
private UIInput customerNameTextField;
private UIInput branchNameTextField;
private UIInput openDateTextField;
private UIInput closingBalanceTextField;
private UIInput addressTextArea;
private UIInput emailIdTextField;
private UIInput phoneNumberTextField;
public AccountSearcher() {
AccountCreator.createTestAccounts();
}
public void search(ActionEvent actionEvent){
String strAccountNo = (String)getAccountTextField().getSubmittedValue();
long accountNo = 0L;
try{
accountNo = Long.parseLong(strAccountNo);
account = AccountCreator.getAccountInfo(accountNo);
if (account != null){
setComponentsValueToNull();
}else{
// Error Message.
}
}catch(Exception exception){
exception.printStackTrace();
}
}
private void setComponentsValueToNull(){
bankNameTextField.setSubmittedValue(null);
customerNameTextField.setSubmittedValue(null);
branchNameTextField.setSubmittedValue(null);
openDateTextField.setSubmittedValue(null);
closingBalanceTextField.setSubmittedValue(null);
addressTextArea.setSubmittedValue(null);
emailIdTextField.setSubmittedValue(null);
phoneNumberTextField.setSubmittedValue(null);
}
public Account getAccount() {
return account;
}
public void setAccount(Account account) {
this.account = account;
}
public UIInput getAccountTextField() {
return accountTextField;
}
public void setAccountTextField(UIInput accountTextField) {
this.accountTextField = accountTextField;
}
public UIInput getBankNameTextField() {
return bankNameTextField;
}
public void setBankNameTextField(UIInput bankNameTextField) {
this.bankNameTextField = bankNameTextField;
}
public UIInput getCustomerNameTextField() {
return customerNameTextField;
}
public void setCustomerNameTextField(UIInput customerNameTextField) {
this.customerNameTextField = customerNameTextField;
}
public UIInput getBranchNameTextField() {
return branchNameTextField;
}
public void setBranchNameTextField(UIInput branchNameTextField) {
this.branchNameTextField = branchNameTextField;
}
public UIInput getOpenDateTextField() {
return openDateTextField;
}
public void setOpenDateTextField(UIInput openDateTextField) {
this.openDateTextField = openDateTextField;
}
public UIInput getClosingBalanceTextField() {
return closingBalanceTextField;
}
public void setClosingBalanceTextField(UIInput closingBalanceTextField) {
this.closingBalanceTextField = closingBalanceTextField;
}
public UIInput getAddressTextArea() {
return addressTextArea;
}
public void setAddressTextArea(UIInput addressTextArea) {
this.addressTextArea = addressTextArea;
}
public UIInput getEmailIdTextField() {
return emailIdTextField;
}
public void setEmailIdTextField(UIInput emailIdTextField) {
this.emailIdTextField = emailIdTextField;
}
public UIInput getPhoneNumberTextField() {
return phoneNumberTextField;
}
public void setPhoneNumberTextField(UIInput phoneNumberTextField) {
this.phoneNumberTextField = phoneNumberTextField;
}
}
Take a careful look at the implementation of the Search Logic. After getting the submitted value of the Account Text Field by calling UIInput. getSubmittedValue(), the code tries to perform a lookup operation in the Account Storage. If an Account object is obtained, then the code explicitly sets all the submitted information of the UI Components to Null. This is necessary because by setting all the Submitted Value of the Input Components to null, we are ensuring that the Component’s Value will be taken from the appropriate Model Objects.
6) Conclusion
Many of the Vendors have started using Ajax4Jsf Framework in their Web Applications due to its simplicity. No need to depend on JavaScript code to make use of Ajax Functionality. This article initially focused on explaining the need to have another Framework for the Web Tier. Then it provided a Brief Information about the Workflow that happens in an Ajax4Jsf enabled Web Application. Then the most commonly used Ajax4Jsf Tags are explained in detail. Finally the article concluded by giving a Sample AutoComplete Application for populating the User Account Information when given the Account Number.