Tapestry 5 Building Web Applications Alexander Kolesnikov Chapter No. 5 "Advanced Components" In this package, you will find: A Biography of the author of the book A preview chapter from the book, Chapter NO.5 "Advanced Components" A synopsis of the book’s content Information on where to buy this book About the Author Alexander Kolesnikov is an author and software developer from Greenock, Scotland. He wrote his first program in FORTRAN back in 1979 for a computer that occupied several rooms. He currently works as a Java Web Developer for CIGNA International. A Soviet military researcher in the past, he recently graduated as a Master of Science with Distinction in Enterprise Systems Development from Glasgow Caledonian University and has also gained a number of professional certifications from Sun Microsystems (SCJP, SCWCD, SCBCD). His first book on software development was "Java Drawing With Apache Batik" (BrainySoftware, 2007). He is interested in many things, ranging from the most recent web technologies to alternative medicine and wishes wholeheartedly that a day was at least three times longer than it is. I am grateful to the people who made my Tapestry quest happen, and thanks to whom it goes on and on: Howard Lewis Ship, the creator of Tapestry, with special thanks for finding time to review this book; Brian Hainey, my tutor at Glasgow Caledonian, for suggesting Tapestry as a topic for my MSc dissertation; Ian McClure, my manager at CIGNA, who bravely accepted Tapestry as the framework for our next major project, and Viraj Joshi from Packt Publishing whose insightfulness made this book possible. For More Information: www.packtpub.com/tapestry-5/book Tapestry 5 Building Web Applications Tapestry is an open-source framework for creating dynamic, robust, and highly scalable web applications in Java. It divides a web application into a set of pages, each constructed using components. It provides various features such as, allowing the Tapestry framework to assume responsibility for key concerns such as user input validation, localization/internationalization, and exception reporting. It involves creating HTML templates using plain HTML, and combining the templates with small amounts of Java code using (optional) XML descriptor files. Tapestry is designed to handle anything from tiny applications all the way up to massive applications consisting of hundreds of individual pages, developed by large, diverse teams. What This Book Covers Chapter 1 looks at the overall features of Tapestry and tells you why Tapestry is special. It talks about the place of Tapestry in the world of Java web development. It also shows the journey from Tapestry 3 to the current Tapestry 5. Chapter 2 deals with creating a working environment. To develop a Tapestry application, you need to download and install the Java Development Kit (JDK), a project management tool like Maven, and an Integrated Development Environment (IDE) like NetBeans or Eclipse. It also gives a brief description of the procedure to follow when creating a Tapestry project. Chapter 3 describes the various features of Tapestry like page templates and page classes, expansions, components, and so on. It actually makes you comfortable working with Tapestry, creating a bare-bones project, handling expansions and components, navigating between pages, and creating and using Application State Objects (ASOs). Chapter 4 examines some of the components in Tapestry like TextField, PasswordField, Label, PageLink, ActionLink, Loop, If, Output, RadioGroup and Radio, Checkbox, Submit and Select. These are simple components which map almost directly to HTML controls and elements. These are normally used on every page of a Tapestry web application and help you in creating a functionally-rich user interface. For More Information: www.packtpub.com/tapestry-5/book Chapter 5 examines some of the more advanced components such as Grid, BeanEditForm, DateField and FCKEditor. Using these, you can build some functionally-rich user interfaces. You can easily implement repeating patterns like tables and dates on a web page. Chapter 6 covers that feature of Tapestry 5 which prevents a user to input erroneous data on a web page. This feature, which is called user input validation, not only identifies the erroneous field and marks it in some way, but may also explain why it is erroneous. Chapter 7 examines internationalization and localization. These are used to make a web application multi-lingual and display it in different locales. Chapter 8 deals with creating a custom component to enable reusability of code by way of packaging repeating patterns into one single custom component. Appendix A takes you through the basics of Java for developing web applications. It examines the standard structure of a Java web application, the basics of deployment descriptor and WAR files, and Java enabled services. Appendix B tells you how to use db4o to create a real data source. It allows you to store even the most complex object structures with ease, while achieving the highest level of performance. Appendix C gives you some references for obtaining extra information about Tapestry 5 and earlier versions. For More Information: www.packtpub.com/tapestry-5/book Advanced Components We are already familiar with a signifi cant number of Tapestry components, and using them, we can build sophisticated and functionally rich interfaces. It so happens however, that many web applications have certain patterns repeating on their pages. For example, they have tables that display different data or they have forms that accept user input and then put the submitted details into some kind of Java Bean object. Wouldn't it be convenient to have such repeating patterns already implemented as components, ready to be dropped onto a page? It certainly would, and the current version of Tapestry 5 already comes with a few components of this kind. They are great effort savers for us, and in this chapter we are going to introduce them and use them in our Celebrity Collector application. Following are some of the components, we'll examine: • The Grid component allows us to display different data in a fairly sophisticated table. We are going to use it to display our collection of celebrities. • The BeanEditForm component greatly simplifi es creating forms for accepting user input. We shall use it for adding a new celebrity to our collection. • The DateField component provides an easy and attractive way to enter or edit the date. • The FCKEditor component is a rich text editor, and it is as easy to incorporate into a Tapestry 5 web application, just as a basic TextField is. This is a third party component, and the main point here is to show that using a library of custom components in a Tapestry 5 application requires no extra effort. It is likely that a similar core component will appear in a future version of the framework. For More Information: www.packtpub.com/tapestry-5/book Advanced Components Grid Component Previously, we were able to display our collection of celebrities with the help of the Loop component. It wasn't diffi cult, and in many cases, that will be exactly the solution you need for the task at hand. But, as the number of displayed items grow (our collection grows) different problems may arise. We might not want to display the whole collection on one page, so we'll need some kind of a pagination mechanism and some controls to enable navigation from page to page. Also, it would be convenient to be able to sort celebrities by fi rst name, last name, occupation, and so on. All this can be achieved by adding more controls and more code to fi nally achieve the result that we want, but a table with pagination and sorted columns is a very common part of a user interface, and recreating it each time wouldn't be effi cient. Thankfully, the Grid component brings with it plenty of ready to use functionality, and it is very easy to deal with. Open the ShowAll.tml template in an IDE of your choice and remove the Loop component and all its content, together with the surrounding table: <table width="100%"> <tr t:type="loop" t:source="allCelebrities" t:value="celebrity"> <td> <a href="#" t:type="PageLink" t:page="Details" t:context="celebrity.id"> ${celebrity.lastName} </a> </td> <td>${celebrity.firstName}</td> <td> <t:output t:format="dateFormat" t:value="celebrity.dateOfBirth"/> </td> <td>${celebrity.occupation}</td> </tr> </table> In place of this code, add the following line: <t:grid t:source="allCelebrities"/> [ 128 ] For More Information: www.packtpub.com/tapestry-5/book Chapter 5 Run the application, log in to be able to view the collection, and you should see the following result: Quite an impressive result for a single short line of code, isn't it? Not only are our celebrities now displayed in a neatly formatted table, but also, we can sort the collection by clicking on the columns' headers. Also note that occupation now has only the fi rst character capitalized—much better than the fully capitalized version we had before. Here, we see the results of some clever guesses on Tapestry's side. The only required parameter of the Grid component is source, the same as the required parameter of the Loop component. Through this parameter, Grid receives a number of objects of the same class. It takes the fi rst object of this collection and fi nds out its properties. It tries to create a column for each property, transforming the property's name for the column's header (for example, lastName property name gives Last Name column header) and makes some additional sensible adjustments like changing the case of the occupation property values in our example. All this is quite impressive, but the table, as it is displayed now, has a number of defi ciencies: • All celebrities are displayed on one page, while we wanted to see how pagination works.