Skip to content

T
todomvc
Commit e659901d authored by Sindre Sorhus's avatar Sindre Sorhus
Browse files
Options

Switched from jQuery-tmpl to handlebars.js 

Since jQuery-tmpl is depricated
parent fb92c298
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 1570 additions and 18 deletions
todo-example/jquery/index.html
View file @ e659901d
<!doctype html> <!doctype html>
<html> <html lang="en">
<head> <head>
<meta charset="utf-8">
<title>jQuery</title> <title>jQuery</title>
<link rel="stylesheet" href="css/app.css"> <link rel="stylesheet" href="css/app.css">
<script src="js/json2.js"></script> <script src="js/json2.js"></script>
<script src="js/jquery.min.js"></script> <script src="js/jquery.min.js"></script>
<script src="js/jquery.tmpl.js"></script> <script src="js/handlebars-1.0.0.beta.6.js"></script>
<script src="js/app.js"></script> <script src="js/app.js"></script>
<script type="text/x-jquery-tmpl" id="todo-template">
<li class="item {{if done}}done{{/if}}" data-id="${id}">
<div class="view" title="Double click to edit...">
<input type="checkbox" {{if done}}checked="checked"{{/if}}>
<span>${title}</span>
<a class="destroy"></a>
</div>
<div class="edit">
<input type="text" value="${title}">
</div>
</li>
</script>
</head> </head>
<body> <body>
<div id="todoapp"> <div id="todoapp">
...@@ -32,11 +21,25 @@ ...@@ -32,11 +21,25 @@
<div class="count"></div> <div class="count"></div>
</footer> </footer>
</div> </div>
<div id='instructions'> <div id="instructions">
Double-click to edit a todo. Double-click to edit a todo.
</div> </div>
<div id="credits"> <div id="credits">
Created by <a href="http://sindresorhus.com">Sindre Sorhus</a>. Created by <a href="http://sindresorhus.com">Sindre Sorhus</a>.
</div> </div>
<script type="text/x-handlebars-template" id="todo-template">
{{#this}}
<li class="item {{#if done}}done{{/if}}" data-id="{{id}}">
<div class="view" title="Double click to edit...">
<input type="checkbox" {{#if done}}checked="checked"{{/if}}>
<span>{{title}}</span>
<a class="destroy"></a>
</div>
<div class="edit">
<input type="text" value="{{title}}">
</div>
</li>
{{/this}}
</script>
</body> </body>
</html> </html>
\ No newline at end of file
todo-example/jquery/js/app.js
View file @ e659901d
...@@ -33,7 +33,7 @@ jQuery(function($) { ...@@ -33,7 +33,7 @@ jQuery(function($) {
this.render(); this.render();
}, },
cacheElements: function() { cacheElements: function() {
this.$template = $('#todo-template'); this.template = Handlebars.compile( $('#todo-template').html() );
this.$todoApp = $('#todoapp'); this.$todoApp = $('#todoapp');
this.$todoList = this.$todoApp.find('.items'); this.$todoList = this.$todoApp.find('.items');
this.$footer = this.$todoApp.find('footer'); this.$footer = this.$todoApp.find('footer');
...@@ -60,8 +60,7 @@ jQuery(function($) { ...@@ -60,8 +60,7 @@ jQuery(function($) {
list.on( 'click', '.destroy', this.destroy ); list.on( 'click', '.destroy', this.destroy );
}, },
render: function() { render: function() {
var html = this.$template.tmpl( this.todos ); this.$todoList.html( this.template( this.todos ) );
this.$todoList.html( html );
this.renderFooter(); this.renderFooter();
this.store( this.todos ); this.store( this.todos );
}, },
......
todo-example/jquery/js/handlebars-1.0.0.beta.6.js 0 → 100644
View file @ e659901d
This diff is collapsed.
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment
GitLab Nexedi Edition | About GitLab | About Nexedi | 沪ICP备2021021310号-2 | 沪ICP备2021021310号-7