CODEWITHSUNDEEP
backbone.jsbackbone-views
3gwebtrain
3gwebtrain

Reputation: 15299

How to assign different class name on view element

In my Backbone view, i am setting tagname, classname, temp value.. all are works fine apart from classname..

how do i set the classname.. or what is the mistake on my code..

define(["singleton","listCollection","listModel"],function(singleton,collection,listModel){
    singleton.view = Backbone.View.extend({
        tagName     :'article',
        className   :'indBoard',
        projectName : true,
        template0   : _.template($('#listTemplate').html()),
        template1   : _.template($('#boardTemplate').html()),
        initialize  :function(options){
            this.template = this['template'+options.tempNo];
            this.tagName = options.tagName;
                    //i am changing to 'li' works
            this.className = options.cName; 
                    //changing to new class name not working
            console.log(options.cName);//consoles new class name properly
                  this.projectName = options.subTempNo == 0 ?true:false;                 
                   //condition as well works..
        },
        render:function(){
            var temp = this.template;
            this.$el.html(temp(this.model.toJSON()));
            return this;
        }
    });
    return singleton.view;
});

Upvotes: 1

Views: 6124

Answers (1)

Paul Hoenecke
Paul Hoenecke

Reputation: 5060

If you set options.className when you create your view instance instead of options.cName, you don't need to try to set it in initialize like that (same for tagName).

Try something like this instead:

var view = new singleton.view({className: 'someClass'});

className is one of the special options that Backbone looks for during the view creation.

From Backbone source:

// List of view options to be merged as properties.
var viewOptions = ['model', 'collection', 'el', 'id', 'attributes', 'className', 'tagName', 'events'];

Actually, I think the reason tagName is working for you is because it is being merged in by Backbone, and not because you are setting it in initialize.

Upvotes: 4

Related Questions