Homepage: http://www.jsviews.com
Author(s): Boris Moore
Version: 1.0.7

On this page:

This plugin adds JsViews functionality to the JsRender plugin. JsViews builds off of standard JsRender templates, but adds two-way declarative data-binding, MVVM, and MVP.

See JQueryRender and https://www.jsviews.com/#jsviews for more details.


In the SCRIPT head

var data = [
    "name": "Robert",
    "nickname": "Bob",
    "showNickname": true
    "name": "Susan",
    "nickname": "Sue",
    "showNickname": false

var template = $.templates("#theTmpl");

template.link("#result", data);

In the BODY

<div id="result"></div>

<script id="theTmpl" type="text/x-jsrender">
  Edit: <input type="checkbox" data-link="editable"/>
  <em>Name:</em> {^{:name}}
  {^{if showNickname && nickname}}
    (Goes by <em data-link="nickname"></em>)
  {^{if editable}}
      <input data-link="name"/>
      <input data-link="nickname"/>
      Show nickname: <input type="checkbox" data-link="showNickname"/>

See the demo

Pretty cool!

Further reading


JsViews templates are very similar to JsRender templates, but with minor changes to the tag structure.

Other functionality includes the $.observe() method for assigning callback functions to respond to observable changes, and the $.view() method for retrieving the data slice associated with a particular View object.

(see http://www.jsviews.com/#jsvapi for lots of details and examples)