Edit Question - KnowledgeHub

Title Body

I have the following scenario - window.Wine = Backbone.Model.extend({ urlRoot: '/wines' }); window.WineCollection = Backbone.Collection.extend({ model: Wine, url: "/wines" }); I have a model and the respective collection defined. window.WineListView = Backbone.View.extend({ el: '#wineList', initialize: function () { this.model.bind("reset", this.render, this); this.model.bind("add", function (wine) { alert("model added"); }); }, render: function (eventName) { _.each(this.model.models, function (wine) { $(this.el).append(new WineListItemView({ model: wine }).render().el); }, this); return this; } }); window.WineListItemView = Backbone.View.extend({ tagName: "li", initiliaze: function () { this.render(); }, render: function (eventName) { var template = _.template($('#wine-list-item').html()); $(this.el).html(template(this.model.toJSON())); return this; } }); The above views creates an individual list item for each model. window.WineView = Backbone.View.extend({ el: $("#mainArea"), initialize: function () { this.render(); }, render: function (eventName) { var template = _.template($("#wine-details").html(), {}); $(this.el).html(template); }, events: { "click #save_form": "save_form" }, save_form: function () { var wine = new Wine(); wine.save(); return false; } }); window.HeaderView = Backbone.View.extend({ el: '.header', initialize: function () { this.render(); }, render: function (eventName) { var template = _.template($('#header').html()); $(this.el).html(template()); return this; }, events: { "click .new": "newWine" }, newWine: function (

Tags (comma-separated) Cancel