CODEWITHSUNDEEP
javascriptjquerybackbone.js
Prometheus
Prometheus

Reputation: 33625

Rendering html in backbone not working

I have an issue with the following code: the div reward_view is not being populated. Render function is being run but this.el seems to be undefined, why?

var ListView = Backbone.View.extend({  
    el: '#reward_view',
    initialize: function(){
        _.bindAll(this, 'render'); // every function that uses 'this' as the current object should be in here
    },
    render: function(){
        console.log(this)
        console.log(this.el)
        $(this.el).html('<h1>Hello' + '</h1>');
        return this; // for chainable calls, like .render().el
    }
});

var myItem = new Item();

myItem.fetch();
var reward_view = new ListView({model:myItem});
reward_view.render();

HTML:

 <div id="reward_view" class="bs-callout bs-callout-info">

        </div>

Upvotes: 1

Views: 82

Answers (1)

kapa
kapa

Reputation: 78681

Your code works fine. I suspect you are doing all this before your document is ready, so #reward_view is not yet to be found.

Upvotes: 2

Related Questions