blob: f4829c776ee89e2642bf3ed302557297311a5aaf (
plain)
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
|
<html>
<head><title>Jstemplates: Quick example</title>
<script src="../util.js" type="text/javascript"></script>
<script src="../jsevalcontext.js" type="text/javascript"></script>
<script src="../jstemplate.js" type="text/javascript"></script>
<script type="text/javascript">
var favdata = {title: 'Favorite Things', favs:['raindrops', 'whiskers', 'mittens']};
function showData(reprocess) {
var templateToProcess;
var peg = document.getElementById('peg');
if (!reprocess) { // Get a copy of the template:
templateToProcess = jstGetTemplate('t1');
// Clear the element to which we'll attach the template:
peg.innerHTML = '';
// Attach the template
domAppendChild(peg, templateToProcess);
}
else { // Use the copy we already have
templateToProcess = peg;
}
// Wrap our data in a context object:
var processingContext = new JsEvalContext(favdata);
// Process the template
jstProcess(processingContext, templateToProcess);
}
</script>
<link rel="stylesheet" type="text/css" href="css/maps2.deb.css"/>
</head>
<body onload="showData(false)">
<!--
The element to which our template will be attached at display-time:
-->
<div id="peg"></div>
<!--
A container to hide our template:
-->
<div style="display:none">
<!--
This is the template div. It will be copied and attached to the div above.
-->
<div id="t1">
<h1 jscontent="title"></h1>
<ul><li jscontent="$this" jsselect="favs"></li></ul>
</div>
</div>
<p>
<a href="#" onclick="favdata.favs.push('packages');showData(true);">Reprocess</a>
</p>
</body>
</html>
|