implement filter and use data-*

moko365 · Nov 15, 2014 · 20a5d05 · 20a5d05
1 parent 8ef86c2
commit 20a5d05
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 3 deletions.
diff --git a/public/index.js b/public/index.js
@@ -36,8 +36,11 @@ app.ListView = Backbone.View.extend({
   render: function() {
     this.$el.html(this.template( this.model.attributes ));
   },
-  click: function() {
-    this.model.filter = '/40/49';
+  click: function(e) {
+    var me = $(e.target);
+    var filter = me.data('filter');
+
+    this.model.filter = filter;
     this.model.fetch();
   }
 });

diff --git a/views/index.jade b/views/index.jade
@@ -5,7 +5,12 @@ block content
   div#userList
 
   script(type='text/template', id='tmpl-user-list')
-    button.btn.btn-primary#btn-filter 40-49
+    .btn-group
+        button.btn.btn-primary#btn-filter(data-filter='/20/29') 20-29
+        button.btn.btn-primary#btn-filter(data-filter='/30/39') 30-39
+        button.btn.btn-primary#btn-filter(data-filter='/40/49') 40-49
+        button.btn.btn-primary#btn-filter(data-filter='/50/59') 50-59
+        button.btn.btn-primary#btn-filter(data-filter='/60/69') 60-69
     h3 User List
     ul
       <% _.each(users, function(user) { %>