Shubh
Shubh

Reputation: 6741

Object doesn't support property or method 'bind' - Backbone.js

I have build my application in Backbone.js using MVC. Everything, is running fine in Chrome/Firefox/IE 9 and above but not in IE8 and below:-

var userDetailView = backbone.View.extend({
    el: '#user-details',
    tagName: 'div',
    template: Handlebars.templates.UserDetails,
    model: userModel,

    initialize: function () {
        _.bindAll(this, "render");
        this.model.bind('change', this.render);
        return this;
    }
});

I am getting error as below:-

SCRIPT438: Object doesn't support property or method 'bind'

Can anyone help?

Upvotes: 1

Views: 5211

Answers (1)

mu is too short
mu is too short

Reputation: 434785

What is this.model? How are you instantiating that view? I'd guess that this.model is not what it should be. In a view, the model property should be a model instance and you're suppose to say things like:

var m = new Model;
var v = new View({ model: m });

A model instance will have a bind method (AKA on) but, in non-stone-age browser, so will a function:

The bind() method creates a new function that, when called, has its this keyword set to the provided value, with a given sequence of arguments preceding any provided when the new function is called.

A model "class":

var M = Backbone.Model.extend({ ... });

is a function (just like anything else you can call new on in JavaScript). This means that you can say things like this in newer browsers:

var M = Backbone.Model.extend({ ... });
var v = new View({ model: M });

and this.model.bind('change', this.render) will execute inside the View, it won't call the bind you're looking for but it will call a bind, it will call Function.bind.

Start passing a model instance to your view and things should start making more sense.


Clarification: If you check the MDN Browser compatibility section on Function.bind, you'll see that there is no bind for functions in IE until IE9. So Chrome, Firefox, and IE9 all support calling bind on functions but IE8 does not; this precisely matches the observed behavior.

Upvotes: 4

Related Questions