Export JSF Datatable as Excel, PDF, CSV, XML

PrimeFaces ships with an exporter feature that can export any data presented with a JSF datatable to various formats such as Excel, PDF, CSV and XML.
Exporter is implemented as an actionListener so it can be attached to any command component like a button or a command link.
Here is a regular JSF datatable;

<h:dataTable id="tbl" var="car" value="#{bean.cars}">
    <h:column>
        <f:facet name="header">
            <h:outputText value="Model" />
        </facet>
        <h:outputText value="#{car.model}" />
    </h:column>

   //more columns

</h:dataTable>

Export as Excel

    <h:commandButton value="Excel Export">
        <opt:exportActionListener type="xls" target="tbl" fileName="cars"/>
    </h:commandButton>

Export as PDF

    <h:commandButton value="PDF Export">
        <opt:exportActionListener type="pdf" target="tbl" fileName="cars"/>
    </h:commandButton>

Export as CSV

    <h:commandLink value="CSV Export">
        <opt:exportActionListener type="csv" target="tbl" fileName="cars"/>
    </h:commandLink>

Export as XML

    <h:commandLink value="XML Export">
        <opt:exportActionListener type="xml" target="tbl" fileName="cars"/>
    </h:commandLink>

Exclude Columns

Sometime a column may contain delete, detail buttons, checkboxes and other stuff. In such cases these columns need to be ignored
in export process. excludeColumns attribute takes the column indexes to exlude.

    <h:commandButton value="Excel Export">
        <opt:exportActionListener type="xls" target="tbl" fileName="cars" excludeColumns="0,1"/>
    </h:commandButton>

Online Demo

To see exporter in action, checkout the online demo of PrimeFaces.

Update: exportActionListener joined to PrimeFaces UI from Optimus and will be available as a p:dataExporter component in 0.9.0. Note that exportActionListener will not be available in optimus-0.7.3.

PrimeFaces 0.8.2 is released

Currently PrimeFaces has a monthly release lifecycle, I’ve just made the march release that contains several improvements, new component and more. This release marks carousel a stable component, adds commandLink, changes the way tooltip and more.

In addition optimus 0.7.2 is released which adds CSV and XML export features to any jsf datatable in addition to the Excel and PDF export.

See the full changelog here.

PrimeFaces Session Slides

During my visit to Turkey, I was invited to do a talk in “Java EE Day” organized by University of Bahcesehir (Istanbul) and CETURK(Computer Engineering Turkiye) Community. My talk was “Introducing PrimeFaces”, you can find the slides of my session in PDF format here.

And some pictures;

Cropping images with JSF

PrimeFaces provides an imageCropper component to cut a certain region of an image to create a new one. The cropped part is passed to the bound backing bean value as a CroppedImage object which belongs to PrimeFaces api.  A simple example would be;

<p:imageCropper value="#{cropperBean.croppedImage}" image="ui/barca/campnou.jpg" />

When the page is rendered, a mask is applied onto the page and it’ll look like;

ImageCropper is an input component so when the form is submitted, the cropped part is passed to the cropperBean’s croppedImage property. From there on it’s developer’s responsibility to what to do with the cropped image. Here’s is an example that saves the new image to a folder on the server.

import java.io.File;
import java.io.FileNotFoundException;
import java.io.IOException;

import javax.faces.context.FacesContext;
import javax.imageio.stream.FileImageOutputStream;
import javax.servlet.ServletContext;

import org.primefaces.optimus.config.Scope;
import org.primefaces.optimus.config.annotations.Controller;
import org.primefaces.ui.component.imagecropper.CroppedImage;

@Controller(name="cropperBean", scope=Scope.REQUEST)
public class ImageCropperBean {

    private CroppedImage croppedImage;

    public CroppedImage getCroppedImage() {
        return croppedImage;
    }

    public void setCroppedImage(CroppedImage croppedImage) {
        this.croppedImage = croppedImage;
    }

    public String crop() {
        ServletContext servletContext = (ServletContext) FacesContext.getCurrentInstance().getExternalContext().getContext();
        String newFileName = servletContext.getRealPath("") + File.separator + "ui" + File.separator + "barca" + File.separator+ "croppedImage.jpg";

        FileImageOutputStream imageOutput;
        try {
            imageOutput = new FileImageOutputStream(new File(newFileName));
            imageOutput.write(croppedImage.getBytes(), 0, croppedImage.getBytes().length);
            imageOutput.close();
        } catch (FileNotFoundException e) {
            e.printStackTrace();
        } catch (IOException e) {
            e.printStackTrace();
        }

        return null;
    }
}

See ImageCropper in action

PrimeFaces online demo contains two imagecropper examples, one with regular submit and one with ajax powered image cropping.