piątek, 16 stycznia 2009

Pierwsze kroki z RichFaces

Witam, dzisiaj zajmiemy się ciekawym zagadnieniem, jakim jest biblioteka Richfaces. Umożliwia ona nam m.in. łatwą integrację naszej aplikacji z Ajax-em, czy stworzenie ładnego layoutu strony. Dokładny opis co jeszcze potrafi znajdziecie tutaj . Głównym konkurentem Richfaces-a na rynku jest IceFaces, ich zestawienie można znaleźć tutaj. Tak więc chcąc rozpocząć pracę musimy sciągnać biblioteke na dysk, pobieramy stąd potrzebne pliki. Następnie potrzebne nam będą jeszcze 2 pliki, a dokładnie commons-digester-1.8.jar oraz commons-beanutils-1.8.0.jar

Na początku dodajmy potrzebne pliki jar do projektu, a więc wrzucamy do katalogu WebContent/WEB-INF/lib pliki z katalogu lib RichFaces-a, jak również ściągniete pliki commons-digester-1.8.jar oraz commons-beanutils-1.8.0.jar.

Teraz zdefiniujmy plik web.xml

<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
  xmlns="http://java.sun.com/xml/ns/javaee" xmlns:web="http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd"
  xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd"
  id="WebApp_ID" version="2.5">
  <display-name>JavaZPiwnicy-Richfaces</display-name>

  <context-param>
    <param-name>org.richfaces.SKIN</param-name>
    <param-value>blueSky</param-value>
  </context-param>

  <filter>
    <display-name>RichFaces Filter</display-name>
    <filter-name>richfaces</filter-name>
    <filter-class>org.ajax4jsf.Filter</filter-class>
  </filter>

  <filter-mapping>
    <filter-name>richfaces</filter-name>
    <servlet-name>Faces Servlet</servlet-name>
    <dispatcher>REQUEST</dispatcher>
    <dispatcher>FORWARD</dispatcher>
    <dispatcher>INCLUDE</dispatcher>
  </filter-mapping>

  <listener>
    <listener-class>com.sun.faces.config.ConfigureListener</listener-class>
  </listener>

  <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>
</web-app>
Stwórzmy bardzo prostego mbean-a:

package com.blogspot.javazpiwnicy;

public class Osoba {
  private String imie;

  public String getImie() {
    return imie;
  }

  public void setImie(String imie) {
    this.imie = imie;
  }
}
Następnie dopisujemy do faces-config.xml

<managed-bean>
  <managed-bean-name>osoba</managed-bean-name>
  <managed-bean-class>com.blogspot.javazpiwnicy.Osoba</managed-bean-class>
  <managed-bean-scope>session</managed-bean-scope>
</managed-bean>
I ostatnie co nam zostało to prosta strona jsp

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
 pageEncoding="ISO-8859-1"%>
<%@ taglib prefix="f" uri="http://java.sun.com/jsf/core"%>
<%@ taglib prefix="h" uri="http://java.sun.com/jsf/html"%>
<%@ taglib uri="http://richfaces.org/a4j" prefix="a4j"%>
<%@ taglib uri="http://richfaces.org/rich" prefix="rich"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Witaj ;)</title>
</head>
<body>
<f:view>
  <center><rich:panel header="Powitanie" style="width: 400px">
    <a4j:form>
      <h:panelGroup>
        <h:panelGrid columns="3">
          <h:outputText value="Podaj imie" />
          <h:inputText value="#{osoba.imie}" />
          <a4j:commandButton value="Zatwierdz" reRender="powitanie" />
        </h:panelGrid>
      </h:panelGroup>
    </a4j:form>

    <h:panelGroup id="powitanie">
      <h:outputText value="Witaj " rendered="#{not empty osoba.imie}"/>
      <h:outputText value="#{osoba.imie}" />
    </h:panelGroup>

  </rich:panel></center>
</f:view>
</body>
</html>
Na początku pliku dodaliśmy nowe tagliby, abyśmy mogli korzystac z dobrodziejstw RichFaces i Ajaxa

<%@ taglib uri="http://richfaces.org/a4j" prefix="a4j"%>
<%@ taglib uri="http://richfaces.org/rich" prefix="rich"%>
Stworzyliśmy prostą stronę witającą użytkownika po wpisaniu imienia. atrybut reRender commandButton'a powoduje ponowne wyrenderowanie komponentu o wskazanym id. Napis "Witaj" wyświetli się w naszym przypadku tylko wtedy, kiedy po kliknięciu na Zatwiedz pole osoby nie będzie puste.
W celu dalszego dokształcania się polecam stronę z liveDemo
Autor: o
Etykiety: , ,

4 komentarze:

  1. Jacek Juraszek16 stycznia 2009 09:36

    Obecnie używam RichFaces ze względu na łatwą i efektywną integrację ze SpringFramework. Szkielety RichFaces, SpringFramework i Hibernate Validator dają się idealnie integrować. W moim artykule opisałem sposób wykorzystania anotacji szkieletu HibernateValidator w ramach stron jspx wykorzystujacych odpowiedni komponent RichFaces.

    OdpowiedzUsuń
  2. Szymon S.16 stycznia 2009 16:17

    Taki szkielet powinnien byc pisany w xhtml'u do jsp ciezko dorzucic support faceletow (ui), trzeba sciagac tagliby etc i smiecic w projekcie:P XHTML ftw;)

    OdpowiedzUsuń
  3. Anonimowy17 stycznia 2009 01:59

    ten jsp nie będzie w stanie wyświetlać polskich znaków... mam taki problem, że nawet jak zmienię kodowanie na UTF-8 i używam polskich znaków w treści (a przecież bez tego ani rusz) to nawet nie mogę pliku zapisać bo się pruje o kodowanie! :/ najlepiej jakbyś opisał jak skonfigurować wszystko żeby facelets razem z richfaces chodziło :)

    OdpowiedzUsuń
  4. Dominik Zmitrowicz17 stycznia 2009 11:15

    Zmień nagłówek pliku jsp na:
    <%@ page language="java" contentType="text/html; charset=ISO-8859-2"
    pageEncoding="ISO-8859-2"%>
    lub podmień na UTF-8.
    Jeżeli dalej nie działa upewnij się, że pisząc używasz tego samego kodowania, w którym chcesz
    wyświetlać.

    OdpowiedzUsuń

Subskrybuj: Komentarze do posta (Atom)