jTemplates模板代码
Code1
<%
@ Page Language="C#" AutoEventWireup="true" CodeBehind="MyDemo.aspx.cs" Inherits="JsonDemo.MyDemo" %>2
3
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">4
<html xmlns="http://www.w3.org/1999/xhtml">5
<head runat="server">6
<title>MyDemo</title>7
8
<script src="JS/jquery-1.3.2.min.js" type="text/javascript"></script>9
10
<script src="JS/jTemplate.js" type="text/javascript"></script>11
<style>12
ul{}{ clear:both; list-style:none;}13
li{}{float:left;width:100px;}14
</style>15
</head>16
<body>17
<form id="form1" runat="server">18
<ul id="InfoBox1">19
</ul>20
<ul id="InfoBox2">21
</ul>22
<div id="result" >23
</div>24
25
<%-- foreach模板--%>26
<textarea id="datatemplate" style="display: none;">27
{#foreach $T as record begin=0 count=10 step=1} 28
<li>29
{#if $T.record.Id == 1} true30
{#else} false31
{#/if}32
</li>33
{#/for}34
</textarea>35
<script type="text/javascript">36
$("#InfoBox1").setTemplateElement("datatemplate");37
$("#InfoBox1").processTemplate([{Id:"1",Name:"靓仔仔"},{Id:"2",Name:"靓仔仔too"},{Id:"2",Name:"靓仔仔3"}]);38
</script>39
40
<%-- for模板--%>41
<textarea id="datatemplate2" style="display: none;">42
{#for i = 1 to $T.last} 43
{$T.content}{$T.i}44
{#/for}45
</textarea>46
<script type="text/javascript">47
$("#InfoBox2").setTemplateElement("datatemplate2");48
$("#InfoBox2").processTemplate({last:8,content:"Number：", table:[{Id:"1",Name:"靓仔仔"},{Id:"2",Name:"靓仔仔too"},{Id:"2",Name:"靓仔仔3"}]});49
</script>50
51
<script>52
var data = {53
name: 'User list',54
list_id: 4,55
table: [56
{id: 1, name: 'Anne', age: 22, mail: 'anne@domain.com'},57
{id: 2, name: 'Amelie', age: 24, mail: 'amelie@domain.com'},58
{id: 3, name: 'Polly', age: 18, mail: 'polly@domain.com'},59
{id: 4, name: 'Alice', age: 26, mail: 'alice@domain.com'},60
{id: 5, name: 'Martha', age: 25, mail: 'martha@domain.com'}61
]62
};63
$("#result").setTemplateURL("example_multitemplate1.tpl");64
$("#result").processTemplate(data);65
</script>66
</form>67
</body>68
</html>example_multitemplate1.tpl*** main template *** (all part outside templates are invisible}
{#template MAIN}
<div>
<div>{$T.name.bold()}</div>
{#include table root=$T.table}
</div>
{#/template MAIN}
-----------------------------------------
*** main table ***
{#template table}
{#foreach $T as r}
{#include row root=$T.r}
{#/for}
{#/template table}
-----------------------------------------
*** for each row ***
{#template row}
<ul bgcolor="{#cycle values=['#AAAAEE','#CCCCFF']}">
<li>{$T.name.bold()}</li>
<li>{$T.age}</li>
<li>{$T.mail.link('mailto:'+$T.mail)}</li>
</ul>
{#/template row}