Matthias Wessendorf’s Weblog

Using Dojo and Apache Trinidad

February 16, 2008 · 8 Comments

In Trinidad there is an ExtendedRenderKitService interface, which allows you to add JavaScript to be rendered during the following request, like:


ExtendedRenderKitService service =
  Service.getRenderKitService(facesContext,
    ExtendedRenderKitService.class);
service.addScript(facesContext, "alert('hello Trinidad');");

Once the rendering is complete, you will notice a simple alert() in your browser window.Having this feature in mind, you can “call” your custom JavaScript from the server. Well, the reality is that the implementation of the interfaces (the Trinidad renderkit) adds your JavaScript call to the (ajax) response. When processing a PPR request, the XHR response will look like:


<?xml version="1.0" ?>
  <?Tr-XHR-Response-Type ?>
  <content  action="/app/faces/ajax.xhtml">
  ...
  <script><![CDATA[alert('hello Trinidad');]]></script>
  </content>

As you see the JS is added to the very end of the response and the browser simple evaluates the added JavaScript. This ExtendedRenderKitService feature offers you the possibility to easily integrate 3rd party JavaScript libraries, such as Dojo Toolkit.Imagine that your application needs to give feedback, when you created/deleted something (like a user). Using the JavaScript alert() function is fine, but well, that really doesn’t look nice! Dojo has a great Dialog component to display a notification like “User ABC has been created!”.

On the server you need to do something like:


...
extendedRenderKitService.addScript(context,
  "showDialog('" +
    newUser.getSecondname() + ", "+
    newUser.getFirstname() +
  "');");
...

The required showDialog(…) JavaScript function could look like:


function showDialog(user)
{
  var dialog = new dijit.Dialog(
{id:"dialog1", title: "New User created!"});
  var dialogContent =
"Successfully created the user: \"" + user + "\"";
  dialog.setContent(dialogContent);
  dialog.show();
}

Once the response is rendered completely, you’ll notice something like:

dojodialog.png

This way enables an easy integration of nice 3rd party JavaScript. Today I updated FacesGoodies (in SVN only) to reflect this integration.

Have fun!

Categories: ajax · apache · dojo · javascript · jsf · myfaces · trinidad · web²

8 responses so far ↓

Leave a Comment