Home arrow Apache arrow Tapestry and AJAX: Autocompleter and InlineEditBox

Tapestry and AJAX: Autocompleter and InlineEditBox

Although the term "AJAX" was coined not so long ago, AJAX-like functionality has already been available in Tapestry for quite some time. In Tapestry 4.0 we can use Tacos, a rich and interesting library of custom Tapestry components that includes a number of AJAX-driven components. Tapestry 4.1 has Dojo JavaScript library built into it, so it comes with some core AJAX-enabled components.

TABLE OF CONTENTS:
  1. Tapestry and AJAX: Autocompleter and InlineEditBox
  2. The IAutocompleteModel interface
  3. Enabling JavaScript
  4. Meet InlineEditBox
By: Alexander Kolesnikov
Rating: starstarstarstarstar / 11
June 18, 2007

print this article
SEARCH DEV SHED

TOOLS YOU CAN USE

advertisement

A downloadable zip file is available for this article.

The essence of AJAX is that we don't need to request the whole page from the server every time we want to change it. Instead, the page contains some clever dynamic things in it (with Tapestry these things are AJAX-enabled components) that can communicate with the server behind the scenes and redisplay themselves with new information quickly and smoothly in some clever way.

The benefit of Tapestry AJAX components is that you can use AJAX without any knowledge of JavaScript whatsoever. Components encapsulate everything required for their work, and you only need to configure their required bindings. Well, in fact there is one additional chore when dealing with AJAX components: you have to make JavaScript libraries available to the page. For this, you'll have to use Shell and Body components in the same way as we did it for DatePicker in one of the previous articles.

I decided to introduce one of Tapestry's AJAX components now because Autocompleter is quite similar to the PropertySelection component we dealt with in the previous article. It has the same two required bindings, model and value, and its model is an implementation of a special interface with a few methods for us to implement. So it shouldn't be too difficult.

The idea is to propose to the users of the CelebrityCollector application an alternative way of selecting a Celebrity of the Week. We don't want to keep them desperately searching a long list of celebrities trying to find their favorite. Instead, they will enter the first few characters of their favorite's surname into the Autocompleter, and this clever component, after an invisible rendezvous with the server, will suggest a list of available surnames starting from the entered characters. Here is the result we want to achieve:

As usual, let's begin with a mock up. Here is the old form for selecting a Celebrity of the Week:

<form action="" jwcid="@Form">

  <select jwcid="selectCelebrity">

    <option value="1">Angelina Jolie</option>

    <option value="2">Bill Gates</option>

  </select>

  <input type="submit" value="Save"/>

</form>

Change it to become

<form action="" jwcid="@Form">

  <select jwcid="selectCelebrity">

    <option value="1">Angelina Jolie</option>

    <option value="2">Bill Gates</option>

  </select><br/><br/>

  <input type="text" jwcid="auto"/><br/><br/>

  <input type="submit" value="Save"/>

</form>

The addition is very simple: we use a text box as a placeholder for the future Autocompleter, and it is marked as a Tapestry component. The next step is to configure this component in the page specification:

<component id="auto" type="Autocompleter">

  <binding name="model" value="autoModel"/>

  <binding name="value" value="celebrityOfTheWeek"/>

</component>

It looks very similar to PropertySelection, doesn't it? It connects straight to the ASO, in the same way as the PropertySelection does, but its model should implement a different interface, the IAutocompleteModel.



 
 
>>> More Apache Articles          >>> More By Alexander Kolesnikov
 

blog comments powered by Disqus
escort Bursa Bursa escort Antalya eskort
   

APACHE ARTICLES

- Apache Unveils Cassandra 1.2
- Apache on ARM Chips? Dell and Calxeda Help M...
- The Down Side of Open Source Software
- VMware Unveils Serengeti for Apache Hadoop
- SAP Takes Steps to Improve Hadoop Integration
- Looking to Hone Apache Hadoop Skills?
- How to Install Joomla on WAMPP
- Working with XAMPP and Wordpress
- GUI Available for Apache Camel
- Reduce Server Load for Apache and PHP Websit...
- Creating a VAMP (Vista, Apache, MySQL, PHP) ...
- Putting Apache in Jail
- Containing Intrusions in Apache
- Server Limits for Apache Security
- Setting Permissions in Apache

Developer Shed Affiliates

 


Dev Shed Tutorial Topics: