Implement client Interportlet using Dojo and WebSphere Portal commun

Introduction

Many portal developers have used the WebSphere portal to create collaborative portlets for sharing events and data to enhance the user experience. For example, a selection submitted in one Portlet can cause updated information to be displayed in multiple related portlets, thus helping the portlets to remain synchronized in their representations. This feature is implemented on the server and relies on the Portlet to submit an action request to the server so that the server can perform data transfer before the page is refreshed.

However, when you add AJAX functionality to a portlet, this approach becomes irrelevant because AJAX features enable you to dynamically update the data displayed by the Portlet without submitting an action request or refreshing the page. This article explains how to use the Dojo JavaScript Toolkit to share data and events between portlets in a browser, which provides collaborative support for dynamically updated portlets.

What is Dojo?

Dojo is an open source JavaScript toolkit that can be used to develop dynamic WEB applications. Many of Dojo's libraries contain Ajax support, DOM manipulation tools, event-handling systems, and customizable widget sets. Dojo combines these libraries with a flexible packaging system so that you can import only the libraries you need, and dojo automatically solves all the dependencies between libraries and libraries for you.

Using Dojo

The dynamic packaging system is the difference between using Dojo libraries and using traditional JavaScript. You can include a Dojo library by performing two steps. You will perform the following two steps:

Includes Dojo booting.<script type="text/javascript" src="/path/to/dojo/dojo.js">
</script>

Identify the Dojo libraries that your application requires. You use the Dojo.require statement to include the administrative features (dojo.widget.*) and Button widgets (Dojo.widget.Button) of the Dojo widget.

<script type="text/javascript">
dojo.require("dojo.widget.*");
dojo.require("dojo.widget.Button");
</script>

The Dojo.require statement specifies the Dojo resources that you will be using in your application. The Dojo boot scans the pages for these Dojo.require statements, and dynamically includes the corresponding libraries to make them available for use. The dynamic load process also handles all dependencies between Dojo libraries, so you simply add require statements to the resources you use.

Use Dojo and WebSphere Portal in combination

Dojo's unique load strategy presents a challenge for Portlet developers. Dojo boot dojo.js should only be included once in an HTML page. Depending on the browser type, if you include dojo.js two times or more than two times, you can cause JavaScript errors and report these errors to end users. The easiest way to avoid this problem in the WebSphere Portal is to include dojo.js in your subject's JSP, and then place the Dojo.require statement in your subject and Portlet JSP as needed.

However, I want the reader to be able to deploy the Portlet without having to modify its subject, after learning the sample application. So I've included the Dojo library in my Portlet project, and I've written the conditional loader in JavaScript.

The condition loader is included in the dojoloader.jsp file:

<script type= "Text/javascript" >
	var path = "<%=request.getcontextpath ()%>/dojo/dojo.js";
	if (typeof dojo== "undefined") {
		document.write (' <s ');
		document.write (' Cript type=\ ' text/javascript\ "src=\");
		document.write (path);
		document.write (' ><\/s ');
		document.write (' cript> ');
	
</script>

This code checks to see if the Dojo JavaScript object exists, and if it is not defined, the code inserts a script to include the dojo.js in the current HTML document. The JavaScript code used to perform this operation is not well understood, so all instances of <script> or </script> in the form of a string must be split, otherwise some browsers will attempt to parse it into the actual start and end statements of the script. The solution to modify the theme JSP will be much simpler. Therefore, use this condition loader technology only if you cannot modify the theme JSP.