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.
| | Discuss The DatePicker and Shell Components of Apache Tapestry | | | | | | | In this article I am doing several things at once: showing how to work with two... | | | | | | WOW- Great tutorials! More on the way? | | | | | | Yes, there should be soon published a tutorial on PropertySelection (Tapestry's... | | | | | | hi alex, u promised weekly tutorials, but i guess u were caught up in work that i... | | | | | | Thank you for your kind response!
The reality is that DevShed got caught up in... | | | | | | Hi Alexander,
On the Memorial Day week, as on most holidays, we usually have a... | | | | | | Yeah, I know, Charles, we need to be philosophical, but that's so difficult when you... | | | | | | I have found your tutorials super helpful in learning tapestry but I have hit a road... | | | | | | Yes, the problem is that I assumed that the readers have the source code available,... | | | | | | Will your examples work with Tapestry 5.0.6 -- I want to reiterate how happy I am... | | | | | | >>> Post your comment now! | | | | | |
|
