1.js

Jump To … +

1.js 2.js 3.js 4.js 5.js

1.js
¶

This example illustrates the declaration and instantiation of a minimalist View.

Working example: 1.html.

Go to Example 2
¶

Self-executing wrapper
```
(function($){
```

ListView class: Our main app view.

  var ListView = Backbone.View.extend({
    el: 'body', // attaches `this.el` to an existing element.

initialize(): Automatically called upon instantiation. Where you make all types of bindings, excluding UI events, such as clicks, etc.

    initialize: function(){
      _.bindAll(this, 'render'); // fixes loss of context for 'this' within methods

       this.render(); // not all views are self-rendering. This one is.
    },

¶

render(): Function in charge of rendering the entire view in this.el. Needs to be manually called by the user.
```
    render: function(){
      this.$el.append("<ul> <li>hello world</li> </ul>");
    }
  });
```

listView instance: Instantiate main app view.

  var listView = new ListView();
})(jQuery);

¶

Follow me on Twitter: @r2r