Sunday, October 14, 2007

JSF immediate attribute

Usage of JSF immediate attribute can lead to a variety of issues, so it is a handle with care piece will one learns the JSF life cycle, different phases and the bypassing through immediate. For more, check:

ClearInputComponents - Myfaces Wiki

Labels: , ,

Tuesday, October 09, 2007

Enterprise Java Community: Building Custom JSF UI Components

Fixing Required messages in JSF

Another interesting phase listener for required messages Fixing Required messages in JSF

JSF 1.2 components already support requiredMessage attribute, so this may not be handy there.

Customizing JSF Required Field Messages per Component Instance is another flavour of the same.

Labels: , ,

Designing and Implementing Web Application Interfaces

Wonderful use of phase listeners in JSF : Designing and Implementing Web Application Interfaces

It outlines how JSF can be enhanced to define custom error messages per component. Mst read for all those who are on JSF 1.1

Labels: , ,

Friday, October 05, 2007

JSF dropdown with BigInteger keys

We wanted to create a drop down with JSF which had keys as java.math.BigInteger and labels as strings. The drop down was to be pre selected with a value. If everything is string, string, thinds work well. However, the drop down value is not prepopulated if it is bound to a BigInteger. Eventually, we were able to solve this with the following code:

JSP




<!DOCTYPE HTML PUBLIC \"-//W3C//DTD HTML 4.01 Transitional//EN\"
\"http://www.w3.org/TR/html4/loose.dtd\">
<%@ page contentType=\"text/html;charset=windows-1252\"%>
<%@ taglib uri=\"http://java.sun.com/jsf/html\" prefix=\"h\"%>
<%@ taglib uri=\"http://java.sun.com/jsf/core\" prefix=\"f\"%>
<f:view>
<html>
<head>
<meta http-equiv=\"Content-Type\"
content=\"text/html; charset=windows-1252\"/>
<title>ConversionTrial</title>
</head>
<body><h:form>
<h:selectOneMenu id=\"menu\" value=\"#{ConversionBean.dto.code}\">
<f:selectItems value=\"#{ConversionBean.valueList}\"/>
</h:selectOneMenu>
</h:form></body>
</html>
</f:view>



Managed Bean



package view;



import java.math.BigInteger;



import java.util.ArrayList;



import javax.faces.model.SelectItem;



public class ConversionBean {

    private DTO dto;

    private ArrayList valueList;

    

    public ConversionBean() {

        dto = new DTO(new BigInteger(\"10\"), \"Large\");

    }

    

    public ArrayList getValueList(){

        valueList = new ArrayList();

        valueList.add(new SelectItem(new BigInteger(\"0\"), \"Small\"));

        valueList.add(new SelectItem(new BigInteger(\"5\"), \"Medium\"));

        valueList.add(new SelectItem(new BigInteger(\"10\"), \"Large\"));

        

        return valueList;

    }

    

    public DTO getDto(){

        return this.dto;

    }

}



DTO




package view;



import java.math.BigInteger;



public class DTO {

    private BigInteger code;

    private String val;

    

    public DTO(BigInteger code, String val) {

        this.code = code;

        this.val = val;

    }

    

    public void setCode(BigInteger s){

        System.out.println(\"setCode to \" + s);

        this.code = s;

    }

    

    public BigInteger getCode(){

        System.out.println(\"getCode returns \" + code);

        return this.code;

    }

}

Labels: , ,

Tuesday, September 18, 2007

Sortable table using JSF and AJAX4JSF

I have written about AJAX and JSF in my previous post. Let us now look at a way to implement sortable tables using JSF and AJAX. We want to build a table which has the header as links. If a particular link is clicked, the table entries are sorted based on the header clicked. We want the entire functionality to be AJAX based, so that only part of the page is refreshed.

A normal JSF table looks like this:



<h:datatable id="addressTableHeader" border="0" cellpadding="0" cellspacing="0">
<h:column>
<f:facet name="header">
<h:outputtext value="Post Code">
</f:facet>
</h:column>
<h:column>
<f:facet name="header">
<h:outputtext value="Street">
</f:facet>
</h:column>
</h:dataTable>
<h:datatable id="addressTableBody" var="tableData" value="#{Bean.addressList}">
<h:column>
<h:outputtext value="#{tabledata.postcode}">
</h:column>
<h:column>
<h:outputtext value="#{tabledata.street}">
</h:column>
</h:dataTable>





The backing bean Bean.java has a method
getAddressList()
which wraps an ArrayList inside a ListDataModel and returns it.

We modify the table header from plain text to links which fire AJAX requests, using Ajax4JSF. We want the table body to be refreshed when the header is pressed, so we specify that in the reRender property of the commandLink.


<h:datatable id="addressTableHeader" border="0" cellpadding="0" cellspacing="0">
<h:column>
<f:facet name="header">
<a4j:commandlink action="#{Bean.postcodeSort}" ajaxsingle="true" rerender="addressTableBody" immediate="true">
<h:outputtext value="Post Code" styleclass="tariffpopupsearchheading">
</a4j:commandLink>
</f:facet>

</h:column>
<h:column>
<f:facet name="header">
<a4j:commandlink action="#{Bean.streetSort}" ajaxsingle="true" rerender="addressTableBody" immediate="true">
<h:outputtext value="Street" styleclass="tariffpopupsearchheading">
</a4j:commandLink>
</f:facet>
</h:column>
</h:dataTable>


We now add a Comparator to the back end code, which can help to sort the ArrayList of data to be presented in the table. The Comparator has different sorting criteria. New methods
postcodeSort()
and
streetSort()
are added to the Bean, which help to set the sorting criteria on click . The Bean's
getAddresslist()
method is modified to pass the appropriate Comparator.

Labels: , , ,

Wednesday, September 12, 2007

JSF and AJAX

The Ajax4jsf Framework is a very interesting and fruitful way of adding AJAX support to the JSF applications. I do not know much AJAX, but I was able to add AJAX support to my application easily.

An interesting link for re-rendering input text boxes. can be found here. I struggled a lot with this concept, but the link helped make things very clear.

Labels: , ,

Wednesday, August 08, 2007

Including one JSF page in another

It seems there is some confusion on how to include one JSF page within another. Here are the steps to include inner.jsp into outer.jsp

1. In outer.jsp, include inner.jsp as a simple JSP include.

<%@ include file="inner.jsp" %>

2. In inner.jsp, include the JSF tag libraries

<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h"%>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f"%>

3. In inner.jsp, create the subview at the beginning of the page:



4. At the end of inner.jsp, close the subview tag

Labels: ,