Custom Dojo Widget with Cross-Domain Build

Nilesh Bansal. 11 March 2008.

This document shows live demo of a custom dojo widget which extends one of widgets provided in dijit. The main focus of this tutorial is how to package the custom widgets while using the cross-domain build of Dojo from AOL CDN. Visit my blog to see how this all works. Use view page source to see all HTML and Javascript code. Version 1.0.2 of Dojo toolkit from http://o.aolcdn.com/dojo/1.0.2/dojo/dojo.xd.js is used for this code. This code has been tested with Firefox 2.0, Konqueror 3.5.1, IE 6 and IE 7. The example below extends the dojo.TitlePane to create a new blogscope.TestWidget which adds a download handler. The extended TitlePane shows an alert message when it finishes loading contents from the external url, set as the href attribute.

Live Demo: Below we have created an instance of blogscope.TestWidget with href=ajaxContents.html. When the widget is expanded and the contents of are fetched from ajaxContents.html, a popup is shown. Opening and closing the widget after the first time will not show the popup message again.