Update with 3 new components

Yesterday, I’ve updated the $TapFX$ project with 3 more components.
I already had them and used them in my project, but i just now managed to add
them to this public library.

The new components are nothing special:

  • ConfirmPageLink and ConfirmDirectLink popup a javascript alert when click, prompting the user for a confirmation in order to go on. The confirmation text is actually taken from the localized resources of the current page.
  • ShowItems displays a list or an array or … anything. You can specify a separator which will be placed in between. The default separator is the comma (,)

2 more components for Tapestry

Just added 2 new components into TapFX ( http://tapfx.sf.net ), Cache and FilteringTable.

The Cache component uses ehcache and allows caching of dynamic content generated in Tapestry pages. Just enclose an html-tapestry fragment with something like

 <span jwcid="@Cache" name="mycache" key="ognl:id"> ... </span>

In this example, the component will search for a cache named mycache and then for the id key. If found, it will ignore its body and output the cached content. Otherwise, the content is rendered and output as normal, but also stored in the given cache with the specified key. Each cache properties are controlled from the ehcache.xml found on your classpath.

The FilteringTable component is a drop-in replacement for contib:Table ( which it uses under the hood ). I’ve already discussed this component in previous blogs and its main purpose is to visually enhance its replacement. It shows navigation controls (using assets for the next, previous, first, last links) both at the top and at the bottom of the table. It can also display a small Form with a TextField near the top navigation control which can be used in order to allow the user to filter the data presented.

My next plans are to provide components for displaying cache statistics and to further enhance FilteringTable with export capabilities.

Installation info is available at the project’s web site.

Allowing Tapestry components to contribute CSS

It has always been easy to contribute javascript from a component to a page in Tapestry. The Body component included in Tapestry framework is responsible for gathering all contributed javascript and placing it either in body’s onLoad or exactly after the body tag.

However, instructing Tapestry to add a CSS, either from within a custom component or while in the middle of a page has always been an issue. I even remember that there was a patched Tapestry version which allowed such functionality.

Well, after reading Using JavaScript to dynamically add Portlet CSS stylesheets by Mark McLaren, a simpler solution can be implemented.

So, I just created a new Style component (included in TapFX v0.30 library) and here’s the code:

 function tapfx_addStyleSheet(styleUrl)
 		var styles = "@import url('" + styleUrl + "');";
 		var newSS=document.createElement('link');


 <?xml version="1.0"?>
     <include-script resource-path="style.js"/>
     <input-symbol required="yes" key="css" class="java.lang.String" />


 <?xml version="1.0" encoding="UTF-8"?>
 <!DOCTYPE component-specification PUBLIC
   "-//Apache Software Foundation//Tapestry Specification 3.0//EN"
 <component-specification allow-informal-parameters="no" allow-body="no">
     <description>Adds a css to the page</description>
     <parameter name="css" type="org.apache.tapestry.IAsset" direction="in" required="yes">
         <description>The css asset to add.</description>


 <span jwcid="@Script" script="/net/sf/tapfx/components/style/Style.script"

I should just mention that all these work for Tapestry v3.01-3.03 for the moment.

Easy Insert for Tapestry

After getting some positive feedback for a previous blog, I decided to add the EasyInsert component into TapFX.

In the latest version (0.15, just get the jar and drop it into your classpath),
you’re able to use the following:

  • ${user.name} . This will become: <span jwcid=”@Insert” value=”ognl:user.name”/>
  • <div class=”${global.class}”>content</div> . This will become: <div jwcid=”@Any” class=”ognl:global.class”>content</div>
  • <div jwcid=”@MyDiv” class=”${global.class}”>content</div> . This will become: <div jwcid=”@MyDiv” class=”ognl:global.class”>content</div>

Anyway, I hope this proves useful to all.