 Apache Page 3 - Apache Tapestry: ASO and More Components |
AddCelebrity page - ApacheWe shall continue working on the CelebrityCollector application. The next step is to create a page for adding a new celebrity. While we create that page, I will introduce you to three more components that will add new capabilities to our application and help us get around certain problems.
print this article SEARCH DEV SHED |
You have already had substantial experience with creating Tapestry pages, so my instructions will be brief: create all three files, AddCelebrity.html, AddCelebrity.page and AddCelebrity.java. As we shall certainly need to use the DataSource, create an abstract getter for it with an appropriate annotation, as we did this in the previous section. Now let's work on the mock up. Let the page look similar to this:
If you are curious as to why I've created these 'Gender' radio buttons, the purpose is to decide how to spell the occupation in case the 'Actor/Actress' option was selected. If it is a man, he will be recorded as an 'Actor,' and vice versa. It's not the best design, I agree, but it allows me to introduce you to two components: RadioGroup and PropertySelection. Here is the source for the mock up: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html> <head> <title>Add New Celebrity</title> </head> <body> <h1>Add New Celebrity</h1>
<form> <table cellpadding="5"> <tr> <td>First Name:</td> <td> <input type="text"/> </td> </tr> <tr> <td>Last Name:</td> <td> <input type="text"/> </td> </tr> <tr> <td>Date of Birth:</td> <td> <input type="text"/> </td> </tr> <tr> <td colspan="2"> <fieldset> <legend>Gender</legend> <input type="radio" name="gender" value="M"> Male <input type="radio" name="gender" value="F"> Female </fieldset> </td> </tr> <tr> <td>Occupation:</td> <td> <select> <option>Actor/Actress</option> <option>Wine-maker</option> <option>Programmer</option> </select> </td> </tr> <tr> <td align="center" colspan="2"> <input type="submit" value="Submit"/> </td> </tr> </table> </form> </body> </html>
blog comments powered by Disqus |
|
|
|
|
|
|
|
