Jquery Templates plugIn -
hey guys, i'm trying example dave ward blog
about jquery templates , i'm doing wrong. appreciated. here's code: data:
var invoice = { invoiceitems: [ { type: 'item', part: '99designs', description: '99 designs logo', price: 450.00, qty: 1 }, { type: 'service', service: 'web development , testing', price: 25000.00 }, { type: 'item', part: 'linodemonthly', description: 'monthly site hosting', price: 40.00, qty: 12 } ] };
client:
<script id="invoicetemplate" type="x-jquery-tmpl"> <table class="invoice"> {{each lineitems}} {{tmpl($value) get_invoicerowtemplatename(type)}} {{/each}} </table> </script>
js:
$(function () { $('#invoicetemplate').tmpl(invoice).appendto('body'); }); function get_invoicerowtemplatename(type) { // return template selector matches our // convention of <type>rowtemplate. return '#' + type + 'rowtemplate'; }
don't forget row templates:
<script id="servicerowtemplate" type="x-jquery-tmpl"> <tr class="service"> <td colspan="2">${service}</td> <td colspan="2">${price}</td> </tr> </script> <script id="itemrowtemplate" type="x-jquery-tmpl"> <tr class="item"> <td>${item}</td> <td>${description}</td> <td>${price}</td> <td>${qty}</td> </tr> </script>
when get_invoicerowtemplatename() resolves each item's type
corresponding *type*rowtemplate, individual row templates used render each item.
Comments
Post a Comment