2150 |
mathias |
1 |
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
|
|
|
2 |
"http://www.w3.org/TR/html4/strict.dtd">
|
|
|
3 |
<html>
|
|
|
4 |
<head>
|
|
|
5 |
<title>Dojo Toolkit - Declaration test</title>
|
|
|
6 |
<style type="text/css">
|
|
|
7 |
@import "../../dojo/resources/dojo.css";
|
|
|
8 |
@import "../themes/tundra/tundra.css";
|
|
|
9 |
@import "css/dijitTests.css";
|
|
|
10 |
</style>
|
|
|
11 |
<script type="text/javascript" src="../../dojo/dojo.js"
|
|
|
12 |
djConfig="parseOnLoad: true, isDebug: true"></script>
|
|
|
13 |
<script type="text/javascript">
|
|
|
14 |
dojo.require("dijit.Declaration");
|
|
|
15 |
dojo.require("dijit.ProgressBar");
|
|
|
16 |
dojo.require("dojo.parser"); // scan page for widgets and instantiate them
|
|
|
17 |
</script>
|
|
|
18 |
</head>
|
|
|
19 |
<body class="tundra">
|
|
|
20 |
<h3>Simple macro:</h3>
|
|
|
21 |
<p>(Check to make sure that links contain employee number)
|
|
|
22 |
<div dojoType="dijit.Declaration" widgetClass="Employee" defaults="{ empid: 123, name: '' }">
|
|
|
23 |
<span>${name}</span>
|
|
|
24 |
<a href="update.php?id=${empid}">update</a>
|
|
|
25 |
<a href="delete.php?id=${empid}">delete</a>
|
|
|
26 |
</div>
|
|
|
27 |
<div dojoType="Employee" empid="100" name="Alan Allen"></div>
|
|
|
28 |
<div dojoType="Employee" empid="101" name="Bob Brown"></div>
|
|
|
29 |
<div dojoType="Employee" empid="102" name="Cathy Cameron"></div>
|
|
|
30 |
|
|
|
31 |
<h3>Using dojoAttachEvent, dojoAttachPoint</h3>
|
|
|
32 |
<div dojoType="dijit.Declaration" widgetClass="HideButton">
|
|
|
33 |
XXX<button dojoAttachEvent="onclick" dojoAttachPoint="containerNode"></button>XXX
|
|
|
34 |
<script type='dojo/method' event='onclick'>
|
|
|
35 |
this.domNode.style.display="none";
|
|
|
36 |
</script>
|
|
|
37 |
</div>
|
|
|
38 |
<button dojoType="HideButton">Click to hide</button>
|
|
|
39 |
<button dojoType="HideButton">Click to hide #2</button>
|
|
|
40 |
|
|
|
41 |
<h3>Extending another widget</h3>
|
|
|
42 |
<p>HideButton2 extends HideButton (above) and changes the template (but keeps the onclick handler).</p>
|
|
|
43 |
<span dojoType="dijit.Declaration" widgetClass="HideButton2" mixins="HideButton">
|
|
|
44 |
YYY<button dojoAttachEvent="onclick" dojoAttachPoint="containerNode"></button>YYY
|
|
|
45 |
</span>
|
|
|
46 |
<button dojoType="HideButton2">Hide me extended</button>
|
|
|
47 |
<button dojoType="HideButton2">Hide me extended #2</button>
|
|
|
48 |
|
|
|
49 |
<h3>Something more complicated:</h3>
|
|
|
50 |
<div dojoType="dijit.Declaration" widgetClass="foo" defaults="{ foo: 'thud', progress: 10 }">
|
|
|
51 |
<script type='dojo/connect' event='startup'>
|
|
|
52 |
this.baz.innerHTML += " (modified by dojo/connect event=startup) ";
|
|
|
53 |
</script>
|
|
|
54 |
|
|
|
55 |
<p>thinger blah stuff ${foo}</p>
|
|
|
56 |
|
|
|
57 |
<div style="width:400px" annotate="true" maximum="200"
|
|
|
58 |
progress="${progress}" dojoType="dijit.ProgressBar"></div>
|
|
|
59 |
<p dojoAttachPoint='baz'>baz thud</p>
|
|
|
60 |
</div>
|
|
|
61 |
|
|
|
62 |
<div dojoType="foo" foo="blah" progress="50"></div>
|
|
|
63 |
<div dojoType="foo" foo="thinger" progress="73"></div>
|
|
|
64 |
|
|
|
65 |
</body>
|
|
|
66 |
</html>
|