Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
Browse files

Add ability to choose a data type

  • Loading branch information...
commit cceca701510d6a9e1e69cd7fe19d73ed9f0a0a8e 1 parent 1816b94
Lewis Marshall authored
Showing with 46 additions and 0 deletions.
  1. +10 −0 app.rb
  2. +31 −0 public/app.js
  3. +5 −0 views/index.erb
View
10 app.rb
@@ -4,3 +4,13 @@
get '/' do
erb :index
end
+
+get '/data-types' do
+ content_type :json
+
+ [
+ { :name => 'Accounts' },
+ { :name => 'Reports' },
+ { :name => 'Blog Posts' }
+ ].to_json
+end
View
31 public/app.js
@@ -0,0 +1,31 @@
+DataTypeCollection = new (Backbone.Collection.extend({
+ url: "/data-types"
+}));
+
+DataTypeView = Backbone.View.extend({
+ tagName: 'button',
+ render: function() {
+ this.$el.text(this.model.get('name'));
+ this.$el.addClass('btn btn-primary');
+ return this;
+ },
+ events: {
+ "click": "chooseDataType"
+ },
+ chooseDataType: function() {
+ console.log(this.model.get('name'));
+ }
+});
+
+App = new (Backbone.View.extend({
+ initialize: function() {
+ DataTypeCollection.bind('reset', this.renderDataTypes, this);
+ DataTypeCollection.fetch();
+ },
+ renderDataTypes: function(data_types) {
+ data_types.each(function(data_type) {
+ var view = new DataTypeView({ model: data_type });
+ $('#data-types').append(view.render().el);
+ });
+ }
+}));
View
5 views/index.erb
@@ -8,11 +8,16 @@
<script src="/underscore-1.4.2.min.js" type="text/javascript"></script>
<script src="/backbone-0.9.2.min.js" type="text/javascript"></script>
<script src="/bootstrap.min.js" type="text/javascript"></script>
+ <script src="/app.js" type="text/javascript"></script>
</head>
<body>
<div class="container">
<h1>JSON Table</h1>
+
+ <h2>Choose the type of data you want to view:</h2>
+
+ <div id="data-types" class="btn-group" data-toggle="buttons-radio"></div>
</div>
</body>
</html>
Please sign in to comment.
Something went wrong with that request. Please try again.