Backbone view is not refreshed according to model.bind

Question

I have an index.html which looks like this -

    <div id="header">

         <div id="form"></div>

    </div>   

    <div><ul id="admin_list"></ul></div>

The backbone header view is defined as follows -

      var headerView = Backbone.View.extend({

        el: "#header",

        initialize: function(){

            this.render();

        },

        events: {

            "click #save": "save_form"

        },

        save_form: function(){

             this.model.save();

             return false;   

        },

        render: function(){

             var template = _.template($("#tmpl_form").html());

             $(this.el).html(template);

        }

    });

The view for the admin list is given below -

     var adminView = Backbone.View.extend({

        el: "#admin_list",

        initialize: function(){

            this.render();

            this.model.bind("add", this.render, this);

        },

        render: function(){

            $(this.el).html("<li>New Model Added</li>");

        }

     });

Finally, I create an instance of the headerView and adminView

      var header_View =  new headerView();

      header_View.render();

My question is, when I save the model the admin_list does not get refreshed with a new li item "New Model Added". I presume, this.model.bind("add", this.render, this) isn't getting called.

Could somebody throw some light on this please!

Cheers!

JavaScript questions and answers, JavaScript questions pdf, JavaScript question bank, JavaScript questions and answers pdf, mcq on JavaScript pdf, JavaScript questions and solutions, JavaScript mcq Test , Interview JavaScript questions, JavaScript Questions for Interview, JavaScript MCQ (Multiple Choice Questions)

Answer 1

In your code above, you are not creating the admin view, only the header view. Also, you need to pass the collection to the views:

var header_View =  new headerView({collection: your_list});

var admin_View =  new adminView({collection: your_list});