• Home
  • Line#
  • Scopes#
  • Navigate#
  • Raw
  • Download
1<html>
2<head><title>Jstemplates: Quick example</title>
3  <script src="../util.js" type="text/javascript"></script>
4  <script src="../jsevalcontext.js" type="text/javascript"></script>
5  <script src="../jstemplate.js" type="text/javascript"></script>
6  <script type="text/javascript">
7
8    var tplData = {username:"Jane User",
9                    addresses:[
10                      {location:"111 8th Av.", label:"NYC front door"},
11                      {location:"76 9th Av.", label:"NYC back door"},
12                      {location:"Mountain View", label:"Mothership"}
13                     ]
14                    };
15
16    function showData() {
17      // This is the javascript code that processes the template:
18      var input = new JsEvalContext(tplData);
19      var output = document.getElementById('tpl');
20      jstProcess(input, output);
21    }
22    </script>
23</head>
24<body onload="showData()">
25
26<!--
27This is the template:
28-->
29
30<div id="tpl">
31<h1>
32  <span jsselect="username" jscontent="$this">User de Fault</span>'s
33  Address Book
34</h1>
35<table cellpadding="5">
36<tr><td><h2>Location:</h2></td><td><h2>Label:</h2></td></tr>
37<tr jsselect="addresses"><td jscontent="location"></td><td jscontent="label"></td></tr>
38</table>
39</div>
40
41</body>
42</html>
43