Arun Gupta, Miles to go ...

Arun Gupta is a technology enthusiast, a passionate runner, and a community guy who works for Sun Microsystems.

« San Francisco Marath... | Main | TOTD #90: Migrating... »

Wednesday August 05, 2009

TOTD #89: How to add pagination to an Apache Wicket application

TOTD #86 explained how to get started with deploying a Apache Wicket application on GlassFish. This Tip Of The Day (TOTD) will show how to add pagination to your Wicket application.

The blog entry "JPA/Hibernate and Wicket Repeating Views with Netbeans" Part 1 and 2 explain in detail how to create a CRUD application using NetBeans, JPA, Hibernate and Wicket. This blog uses the data created in TOTD #38 for the database table.

After creating the JPA Controller, adding the IDataProvider and DataView implementations and hooking together, the application is available at "http://localhost:8080/helloworld" and looks like:

As noticed in the output, all the states are listed in one page. The HTML markup looks like:

<html>
 <head>
 <title>Wicket Quickstart Archetype Homepage</title>
 </head>
 <body>
 Wicket Quickstart Archetype Homepage
 
 message will be here
 <table>
 <tr>
 <th>ID</th>
 <th>Abbreviation</th>
 <th>Name</th>
 </tr>
 <tr wicket:id="rows">
 <td>ID</td>
 <td>Abbreviation</td>
 <td>Name</td>
 </tr>
 </table>

 </body>
</html>

The backing POJO looks like:

package org.glassfish.samples;

import java.util.Iterator;
import org.apache.wicket.PageParameters;
import org.apache.wicket.markup.html.basic.Label;
import org.apache.wicket.markup.html.WebPage;
import org.apache.wicket.markup.repeater.Item;
import org.apache.wicket.markup.repeater.data.DataView;
import org.apache.wicket.markup.repeater.data.IDataProvider;
import org.apache.wicket.model.CompoundPropertyModel;
import org.apache.wicket.model.IModel;
import org.apache.wicket.model.LoadableDetachableModel;
import org.glassfish.samples.controller.StatesJpaController;
import org.glassfish.samples.model.States;

/**
* Homepage
*/
public class HomePage extends WebPage {

    private static final long serialVersionUID = 1L;

    // TODO Add any page properties or variables here

    /**
    * Constructor that is invoked when page is invoked without a session.
    *
    * @param parameters
    *            Page parameters
    */
    public HomePage(final PageParameters parameters) {

        // Add the simplest type of label
        add(new Label("message", "If you see this message wicket is properly configured and running"));

        // TODO Add your page's components here

                // create a Data Provider
        IDataProvider statesProvider = new IDataProvider() {
            public Iterator iterator(int first, int count) {
                StatesJpaController sc = new StatesJpaController();
                return sc.findStatesEntities(count, first).iterator();
            }

            public int size() {
                StatesJpaController sc = new StatesJpaController();
                return sc.getStatesCount();
            }

            public IModel model(final Object object) {
                return new LoadableDetachableModel() {
                    @Override
                    protected States load() {
                        return (States)object;
                    }
                };
            }

            public void detach() {
            }
        };

        // TODO Add your page's components here

        DataView dataView = new DataView("rows", statesProvider) {

            @Override
            protected void populateItem(Item item) {
                States state = (States)item.getModelObject();
                item.setModel(new CompoundPropertyModel(state));
                item.add(new Label("id"));
                item.add(new Label("abbrev"));
                item.add(new Label("name"));
            }
        };

        add(dataView);
    }
}

and "persistence.xml" looks like:

<?xml version="1.0" encoding="UTF-8"?>
<persistence version="1.0" xmlns="http://java.sun.com/xml/ns/persistence" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://java.sun.com/xml/ns/persistence http://java.sun.com/xml/ns/persistence/persistence_1_0.xsd">
<persistence-unit name="helloworld" transaction-type="RESOURCE_LOCAL">
 <provider>org.hibernate.ejb.HibernatePersistence</provider>
 <class>org.glassfish.samples.model.States</class>
 <properties>
 <property name="hibernate.connection.username" value="app"/>
 <property name="hibernate.connection.driver_class" value="org.apache.derby.jdbc.ClientDriver"/>
 <property name="hibernate.connection.password" value="app"/>
 <property name="hibernate.connection.url" value="jdbc:derby://localhost:1527/sample"/>
 </properties>
</persistence-unit>
</persistence>

Lets add pagination to this simple sample.

In the POJO, change DataView constructor so that it looks like:

DataView dataView = new DataView("rows", statesProvider, 5)

where "5" is the number of entries displayed per page. Alternatively you can also set the number of items per page by invoking:

dataView.setItemsPerPage(5);
In the HTML page, add the following right after "<table/>":

message will be here 

as the last line. This is the placeholder for pagination controls.
In the POJO, add the following:

PagingNavigator pager = new PagingNavigator("pager", dataView);
add(pager);

right after "add(dateView);".

The output now looks like:

and clicking on ">" shows:

And finally clicking on ">>" shows

The information is now nicely split amongst multiple pages.

So just adding a pagination controls placeholder in the HTML and a corresponding configuration in DataView (in the backing POJO) did the trick for us.

Please leave suggestions on other TOTD (Tip Of The Day) that you'd like to see. A complete archive of all the tips is available here.

Technorati: wicket glassfish pagination

Posted by Arun Gupta in web2.0 | Comments[3]

|
|

Comments:

Hello Sir, Dr. Arun Gupta

I stumbled on one of your screen cast and if I must confess, it was really helpful.
Sir, I am a baby java-programmer that just started using NetBeans recently on prescription by a fellow programmer. I built a web-service host and client using the NetBean 6.5.1 IDE, which was quite helpful in taking care of so many documentation and interface implementations in java-programming.
Sir, the web-service is a “HugeInteger” web-service that collects (from the client GUI) two integer numbers that normally are larger than the tradition java integer input capacityin an array from the user in a GUI Dialog and carry-out add or subtraction or equality operations on the two inputs, after which, it returns the result to the client-application GUI .

I am designing this work as my final year project to track the time between- which the client sends a request to the host (server) and when the result is been displayed on the client’s GUI-dialog for some research analysis.

I have tested the host in the tester page and all its invocations are alright. I have also designed the client which the NetBean IDE editor certifies to be alright and I previewed it and all seems to be well.
Sir the main problem I am having with this project is that, once I run the client program to get the service used, it displays a JSP page with the an “Hello World” in it. This work was done in JFrame interface sir.
Sir, can you help me view the code and tell me where the likely problem is hidden, if in the IDE or in my code. I will be attaching the client code, and also the displayed JSP page in my the message I will be sending to your e-mail box sir "arun_gupta@sun.com" due to the fact that I could not find any point for attachment on this blog.

I have sent this message via this medium and my e-mail without any reply and that is why I am resending sir.

Thanks for your anticipated support sir.

Your Java Son,
Oluwadare Babatunde .

Posted by oluwadare Babatunde on August 05, 2009 at 11:49 AM PDT #

Hello sir,

I really want to thank you for finding time out of your busy schedule to reply my mail.

As I told you sir, I am a baby programmer, sir I need your help on how to use the timer of class in javax.management.timer, as the illustration in the documentation was not enough sir.

I am working on a mini-project on webservice that needs a timer to track the time a user clicks a Jbutton on the client user-interface and the time the response is been received from the host.

To achieve this, I attached a timer of class in javax.management.timer to each of the buttons in the client interface using “Mouse Clicked” of class “Mouse Event” to track whenever an event has occurred. I have compiled and run the resultant code using NetBeans 6.5.1, all has been okay except for the timer that has failed to display any tracked time at the JLabel, positioned to display the tracked time on the JFrame interface. The JLabel I positioned to display the tracked time does not display anything but only works when I tested it with literal-strings.

The host and client code are attached with this mail sir at arun.gupta@sun.com.

Thanks for anticipated support,
Your Java kid’
Oluwadare Babatunde.

Posted by Oluwadare Babatunde on August 20, 2009 at 05:34 AM PDT #

Oluwadare,

Please ask your questions at users@glassfish.dev.java.net for a quicker response time.

Posted by Arun Gupta on August 20, 2009 at 05:48 AM PDT #