1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
|
<html>
<head>
<title>Demo using dojox.dtl._Templated</title>
<script runat="server">
djConfig = {baseUrl:"/dojo/",usePlainJson: true, parseOnLoad: true};
</script>
<script runat="server" type="text/javascript" src="../../../dojo/dojo.js"></script>
<script runat="server" type="text/javascript">
dojo.require("dojo.jaxer");
dojo.require("dijit.dijit");
dojo.require("dojox.dtl._Templated");
dojo.require("dojo.parser");
dojo.declare("Fruit", [dijit._Widget, dojox.dtl._Templated], {
oldRepl: "Fruit: ",
_dijitTemplateCompat: true,
items: ["apple", "banana", "orange"],
keyUp: function(e){
if(e.keyCode == dojo.keys.ENTER){
var i = dojo.indexOf(this.items, e.target.value);
if(i != -1){
this.items.splice(i, 1);
}else{
this.items.push(e.target.value);
}
e.target.value = "";
this.render();
dojo.query("input", this.domNode).forEach("item.focus();");
}
},
templateString: '<div><input dojoAttachEvent="onkeyup: keyUp"><ul>{% for item in items %}<li>${oldRepl} {{ item }}</li>{% endfor %}</ul></div>'
});
</script>
<body>
<h1>Using Dojo's Django Template language on Jaxer</h1>
<p>
Aptana's Jaxer is server side JavaScript (SSJS) server. With some modifications to
a web page, Dojo can be run on the server. With Dojo running on the server, you can
utilize the Dojo's Django Template library rendering engine to do templating within
Jaxer. The latest build of Dojo includes some patches to properly work with Jaxer,
so you need a build of Dojo later than 2/18/08 to work with Jaxer. Next, the
following modifications to your page are needed to run Jaxer:
<ul>
<li>
You must explicitly set the base url of the Dojo library. Jaxer does not provide
the ability for Dojo to auto-detect the base url as it can in other environments.
Therefore you must declare the base url with the djConfig global variable:
<pre>
<script runat="server">
djConfig = {baseUrl:"/dojo/", // use the base path of dojo here
usePlainJson: true, parseOnLoad: true};
</script>
</pre>
</li>
<li>
Next, you must add the runat attribute with a value of "server" to all of the script
tags that you want executed on the server. Your script tags should look like:
<pre>
<script runat="server" type="text/javascript" src="../../../dojo/dojo.js"></script>
</pre>
</li>
<li>
Last, you must dojo.require("dojo.jaxer") with a script tag. This should immediately
follow the declaration of dojo.js:
<pre>
<script runat="server" type="text/javascript" src="../../../dojo/dojo.js"></script>
<script runat="server" type="text/javascript">dojo.require("dojo.jaxer");</script>
</pre>
</li>
</ul>
</p>
<p>
Once this is done, Dojo should load in Jaxer, and you can utilize the library capabilities of
Dojo. In particular, you can now use DTL renderer as you would on
the browser. If you are running this in Jaxer, below should be a working demonstration of
a template that is rendered on the server.
</p>
<div dojoType="Fruit"></div>
<p>
It is important to note that Jaxer is not capable of transferring the programmaticaly set
event handlers for widgets, it can only send the static HTML to the browser. This means
you can use DTL as a templating engine to create HTML on the server, but Dojo client side widgets
are still necessary if you want to use interactive widgets on the browser.
</p>
</body>
</head>
</html>
|
