AJAX - The Complete Reference

(avery) #1

436 Part II: Developing an Ajax Library^


{foreachelse}
<tr colspan="2"><td>No stooges!</td></tr>
{/foreach}
</table>

Even with just simple selection and looping, quite a number of tasks can be performed.
For example, here is a template we will use later on to build out a data grid. Note the use of
the keymod value in the loop so we can add a class name on even rows to set an alternating
color pattern.

{if $downgradeversion}
{include file="namelist-head.tpl"}
{/if}
<!-- class stripe is used for zebra stripes on the table rows -->
<table cellpadding="3" cellspacing="3" width="400px">
<tr align="left" style="background:#827E86;">
<th>Name</th><th>Type</th><th>Sex</th><th>Age</th>
</tr>
{foreach key=keymod item=i from = $folks}
<tr {if $keymod%2 } class="stripe" {/if}>
<tr style="background:#B4B4AC;">
<td>{$i.name}</td>
<td>{$i.type}</td>
<td>{$i.sex}</td>
<td>{$i.age}</td>
</tr>
{foreachelse}
<tr>
<td colspan="4">There are no records</td>
</tr>
{/foreach}
</table>

{if $downgradeversion}
{include file="namelist-foot.tpl"}
{/if}

In this case, an {if} statement is being used that would only be executed server-side
when a full HTML page has to be built and delivered. In the case of the Ajax-powered
user, the template would come down and a JSON packet would be used to populate the
data grid. We’ll see just such an application shortly, but for now if you want to experiment
with the template system, we provide a basic testing system, shown in Figure 9-5, at
http://ajaxref.com/ch9/templatetester.html. Use this facility to try some simple templates
and make sure you understand how JSON packets will populate the values.

NNOT EOTE The template system was initially derived from a popular JavaScript template library
(http://code.google.com/p/trimpath/wiki/JavaScriptTemplates). Such systems exceed what we
are doing here, as our goal is to provide a common subset of features between client and server
to show a desirable Ajax architectural pattern.
Free download pdf