jSmart - a port of the Smarty Template Engine to Javascript
jSmart is a port of the Smarty Template Engine to Javascript, a JavaScript template library that supports the template syntax and all the features (functions, variable modifiers, etc.) of the well-known PHP template engine Smarty.
jSmart is written entirely in JavaScript, does not have any DOM/DHTML/browser or third-party JavaScript library dependencies and can be run in a web browser as well as a standalone JavaScript interpreter.
jSmart has some limited support of the PHP syntax and allows you to use the same Smarty templates on both server and client side, for both PHP and Javascript.
jSmart supports plugin architecture, you can extend it with custom plugins: functions, blocks and variable modifiers.
A Quick Introduction
- Include jSmart library Javascript file in your header (get the current release from the download page)
<html> <head> <script language="javascript" src="smart-2.4.min.js"></script> </head>
- Create template, use PHP Smarty syntax
<script id="test_tpl" type="text/x-jsmart-tmpl"> <h1>{$greeting}</h1> {foreach $books as $i => $book} <div style="background-color: {cycle values="cyan,yellow"};"> [{$i+1}] {$book.title|upper} by {$book.author} {if $book.price} Price: <span style="color:red">${$book.price}</span> {/if} </div> {foreachelse} No books {/foreach} Total: {$book@total}</script>- Create JavaScript data object with variables to assign to the template
<script> var data = { greeting: 'Hi, there are some JScript books you may find interesting:', books : [ { title : 'JavaScript: The Definitive Guide', author : 'David Flanagan', price : '31.18' }, { title : 'Murach JavaScript and DOM Scripting', author : 'Ray Harris', }, { title : 'Head First JavaScript', author : 'Michael Morrison', price : '29.54' } ] };</script>Don't like to miss out any of our posts? Do Subscribe to our Feed
