
embeddedjavascript
EJS cleans the HTML out of your JavaScript with client side templates. After EJS gets its rubber gloves on dirty code, you'll feel organized and uncluttered.
| Home | Getting Started Guide | NBA Demo | How-to Screencast | |:--------------------------------|:--------------------------------------------------------------------|:----------------------------------------------------|:------------------------------------------------------------------|
Description
EJS is essentially a port of Masatoshi Seki's erb.rb in the Ruby Core. It operates in the same way that PHP, ERB, or any of the other embedded language interpreters work, except where all existing preprocessing engines execute on the server-side, EJS is intended to run within the web browser. This allows client-side code to process JavaScript-based web templates for insertion into the current page without consulting the server.
EJS uses <% %> or [% %] as its magic tags. Like most other frameworks of its type, <% %> tags cause all code within them to be executed, and the addition of an equals sign (<%= %>) causes the enclosed code to be evaluated and the toString representation of the result appended to the document.
Typical Use
EJS templates can be loaded within a page or a separate file. Once the EJS template is loaded, it is passed data used to render template. The result of the render is typically used to update HTML on the page.
Example
With this example, we will create and load a template that displays a list of cleaning supplies.
First, lets create a template file that iterates through a list of supplies: ```
Supplies
```
Next, we create an object to hold those supplies:
var my_supplies = {supplies: ['mop', 'broom', 'duster']}
Finally, we load the template, render it with the supply object, and update an HTML element with the results.
var result = new EJS({url: 'templates/supplies.ejs'}).render(my_supplies);
document.getElementById('supply_list').innerHTML = result
View Helpers
EJS includes view helpers to make building repetitive HTML snippets easier. The view helpers are very similar to Ruby on Rails ActionView helpers.
Example
The following builds a form that adds cleaning supplies.
<%= form_tag('/cleaning/add_supply') %>
<%= input_field_tag('cleaning_supply') %>
<%= submit_tag('Submit') %>
<%= form_tag_end() %>
Error Handling
Using a special version of JSLint, EJS can provide nice error handling when you are developing your templates. By including ejs_fulljslint similar to ```
``` EJS will error with a line number if there is a syntax error.
Project Information
- License: MIT License
- 120 stars
- svn-based source control
Labels:
javascript
templates