Friday, January 20th, 2006

Dojo Progress Widget

Category: Dojo, Showcase

Richard Rodger has written up his experience creating a Dojo progress widget.

Richard shows the JavaScript:


  1. dojo.require("dojo.widget.*");
  2. dojo.hostenv.setModulePrefix('ricebridge', 'ricebridge');
  3. dojo.widget.manager.registerWidgetPackage('ricebridge.widget');
  4. dojo.require("ricebridge.widget.RicebridgeProgress");
  7. function startProgress() {
  8.   var progress = dojo.widget.manager.getWidgetById("progress");
  9.   if( progress ) {
  10.     progress.startProgress();
  11.   }
  12. }
  14. function stopProgress() {
  15.   var progress = dojo.widget.manager.getWidgetById("progress");
  16.   if( progress ) {
  17.     progress.stopProgress();
  18.   }
  19. }

and the HTML:

  1. <div dojoType="RicebridgeProgress" widgetId="progress"
  2.  numboxes="30" width="300" height="20" multiplier="10"
  3.  basecolor="#ccc" oldcolor="#666" hicolor="#00f">
  4. </div>

The widget system of Dojo is very cool, and needs to be talked about more.

The widget in question was used by Richard in his XML Manager

XML Manager

Posted by Dion Almaer at 12:46 am

3.7 rating from 24 votes


Comments feed TrackBack URI

I’m curious to know whether the resulting html is valid markup? There seem to be a lot of Dojo specific attributes on that DIV element.

Comment by Ramin — January 20, 2006

Hey – thanks for the write-up guys! :)

Ramin: no it’s not valid unless you add to the doctype. Or you can use the dojo namespace. Here’s what the dojo docs say:

The dojoType attribute is a proxy for an XML tag name. Standards purists might argue that these extra attributes make the markup invalid, which is true. If you really really want full standards compliance anyway, just use the dojo: namespace for your widgets. However, XML in browsers is hit-or-miss and strict adherence to the letter of a spec and not its spirit is sometimes counter-productive. Since we are able to construct widgets that replace parts of a page arbitrarily, Dojo provides a baked-in an answer to concerns about how DHTML/Ajax works in browsers that don’t support JavaScript or otherwise have strict accessibility requirements. Browsers that can handle it receive the upgraded UI while everyone else gets the “fallback”, all without requiring developers to give up the ease of declaring their widgets where they want them in the page just extending markup. Toolkits that force developers to (manually) place widgets in the flow of the page in JavaScript are a pain to work with and have many of the same maintenance problems that DOM-based widget building approaches share. Markup purist or pragmatist, Dojo lets you have your cake and eat it too.

Comment by Richard Rodger — January 20, 2006

Leave a comment

You must be logged in to post a comment.