The DatePicker and Shell Components of Apache Tapestry - Shell component (Page 2 of 4 )
The Shell component is quite useful and we are going to look at it properly in a later article in this series. For now, just a brief introduction: Shell is used to add to an HTML page a number of standard elements. It adds a <!DOCTYPE ...> element, a <head> element with a <title> in it, can optionally add references to style sheets, and also adds all the necessary code to make the Dojo toolkit accessible for the page.
The only required binding for this component is title, which is a title for the page. Let's define this component implicitly in the opening <html> tag of the page:
<html jwcid="@Shell" title="Add New Celebrity">
Now we have all JavaScript libraries available, but another problem arises: Shell will automatically insert its own DOCTYPE and head elements, in addition to already existing ones. And we don't want our page to have two heads, do we? So let's mark those that we've written ourselves for removal at runtime:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
jwcid="$remove$">
<html jwcid="@Shell" title="Add New Celebrity">
<head jwcid="$remove$">
<title>Add New Celebrity</title>
</head>
Note that the page template still can be previewed by any browser as a browser simply ignores those things it doesn't understand.
The last step in preparations is to make the <body> element of the page template a Tapestry's Body component. This is very simple:
<body jwcid="@Body">
The purpose of this is to tell Tapestry where the page's <body> tag is located, as it will need to insert two bits of JavaScript, required specifically for DatePicker, directly under that tag.
With this, we have completed the preparations for using a DatePicker, so run the application and see how the new component works. Initially, you should see a small calendar image to the right of the Birth Date text box, like this:
When you click this image, a glorious calendar opens, allowing you to pick a date:
Finally, the chosen date is inserted into the text box:
The component is quite impressive, but it has a few deficiencies.
Next: Possible deficiencies of DatePicker >>
More Apache Articles
More By Alexander Kolesnikov
