June 2008
Intermediate to advanced
488 pages
15h 3m
English
Now that you have a feel for exactly how the widget lifecycle
works and have seen plenty of examples, it's time to demonstrate a
tool that you can use for quick, lightweight prototyping. Declaration is a Dijit resource that allows
you to declare a widget in markup without resorting to a separate
JavaScript file; this approach can be a tremendous boon during a
development cycle when you need to rapidly capture or test out an
idea.
Example 12-7 shows our
very first HelloWorld widget using Declaration to create a widget in a
completely self-contained page.
Example 12-7. HelloWorld (Take 6: Declaration)
<html> <head> <title>Hello World, Take 6</title> <script type="text/javascript" src="http://o.aolcdn.com/dojo/1.1/dojo/dojo.xd.js" djConfig="isDebug:true,parseOnLoad:true"> </script> <link rel="stylesheet" type="text/css" href="http://o.aolcdn.com/dojo/1.1/dojo/resources/dojo.css"> </link> <!-- define your CSS inline --> <style type="text/css"> span.hello_class { color: #009900; cursor: pointer; } </style> <script type="text/javascript"> dojo.require("dijit.Declaration"); dojo.require("dojo.parser"); </script> </head> <body> <!-- delcare the widget completely in markup --> <div dojoType="dijit.Declaration" widgetClass="dtdg.HelloWorld" defaults="{greeting:'Hello World'}"> <span class="hello_class" dojoAttachEvent='onmouseover:onMouseOver, onmouseout:onMouseOut'> ${greeting} </span> <script type="dojo/method" event="onMouseOver" args="evt"> dojo.addClass(this.domNode, ...Read now
Unlock full access