summaryrefslogtreecommitdiffstats
path: root/third_party/jstemplate/tutorial_examples/05-jsselect.html
blob: 990df0f9c5f46675e017a9a0e0f291fc0d1518a2 (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
<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 tplData = {username:"Jane User",
                    addresses:[
                      {location:"111 8th Av.", label:"NYC front door"},
                      {location:"76 9th Av.", label:"NYC back door"},
                      {location:"Mountain View", label:"Mothership"}
                     ]
                    };
    
    function showData() {
      // This is the javascript code that processes the template:
      var input = new JsEvalContext(tplData);
      var output = document.getElementById('tpl');
      jstProcess(input, output);
    }
    </script>
</head>
<body onload="showData()">

<!-- 
This is the template:
-->

<div id="tpl">
<h1>
  <span jsselect="username" jscontent="$this">User de Fault</span>'s 
  Address Book
</h1>
<table cellpadding="5">
<tr><td><h2>Location:</h2></td><td><h2>Label:</h2></td></tr>
<tr jsselect="addresses"><td jscontent="location"></td><td jscontent="label"></td></tr>
</table>
</div>

</body>
</html>