Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP
Browse files

show a jQuery'sh example tuto9.html, and simplify another example

  • Loading branch information...
commit cc706812852bec3eeb518af0cb93abea216962b8 1 parent 74fbae0
@pure authored
Showing with 31 additions and 2 deletions.
  1. +2 −1  index.html
  2. +1 −1  js/examples.js
  3. +28 −0 tutorial/tuto9.html
View
3  index.html
@@ -39,6 +39,7 @@
<ol>
<li><a href="tutorial/tuto4.html">Set the value of an HTML node and attribute</a>
<li><a href="tutorial/tuto5.html">Repeat an HTML node (loop)</a>
+ <li><a href="tutorial/tuto9.html">How to use PURE with jQuery</a>
<li><a href="tutorial/tuto5b.html">Use sort and filter on loops</a>
<li><a href="tutorial/tuto5c.html">Chaining multiple rendering</a>
<li><a href="tutorial/tuto5d.html">Nested loops</a>
@@ -70,7 +71,7 @@
<div class="template">
<div class="hello">
- <span class="who"></span>
+ <span></span>
</div>
</div>
View
2  js/examples.js
@@ -7,7 +7,7 @@ var ex01 = {
var ex02 = {
template:'div.hello',
data:{ who:'Hello Wrrrld' },
- directive:{ 'span.who':'who' }
+ directive:{ 'span':'who' }
};
var ex03 = {
View
28 tutorial/tuto9.html
@@ -0,0 +1,28 @@
+<html>
+<head>
+ <title>PURE Unobtrusive Rendering Engine</title>
+ <script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
+ <script src="http://github.com/pure/pure/raw/master/libs/pure.js"></script>
+</head>
+<body>
+
+ <!-- HTML template -->
+ <div class="template">
+ Hello <a></a>
+ </div>
+ <!-- result place -->
+ <div class="result"></div>
+
+ <script>
+ var jsonData = {'who':'BeeBole!', site:'http://beebole.com'};
+
+ $('div.template')
+ //set the directives
+ .directives({ 'a':'who', 'a@href':'site' })
+ //call render with the JSON data
+ .render(jsonData)
+ //use any jQuery command on the generated HTML
+ .appendTo('div.result');
+ </script>
+</body>
+</html>
Please sign in to comment.
Something went wrong with that request. Please try again.