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

Question

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?

@Crungmungus Yes I have. Its is working in Chrome and Mozilla — Shubh
– Shubh, Commented Dec 16, 2013 at 15:39

mu is too short · Accepted Answer · 2013-12-16 15:39:41Z

4

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.

edited Dec 16, 2013 at 15:39

answered Dec 16, 2013 at 15:08

mu is too short

436k71 gold badges863 silver badges822 bronze badges

Sign up to request clarification or add additional context in comments.

6 Comments

backdesk Over a year ago

He says "Everything, is running fine in Chrome/Firefox/IE 9 and above but not in IE8 and below". Taking his word on that, can we not assume this is a browser-related issue?

mu is too short Over a year ago

@Crungmungus: Some browsers support bind on functions, some do not. The "IE8 and below" is a give away.

mu is too short Over a year ago

@Crungmungus: You might want to look at the "Browser compatibility" section of the MDN page on Function.bind and take particular note of the "IE9" part.

mu is too short Over a year ago

@Crungmungus: this.model.bind is an alias for Backbone's on function if this.model is a model instance. If this.model happens to be a function (such as M = Backbone.Model.extend({ ... })) then this.model.bind is the standard bind method on JavaScript functions. Function.bind is support by every browser in the list except IE8 and below.

Shubh Over a year ago

Surprisingly.... it WORKS.... Thank you @mu is too short for explaining it with so much efforts. Accepted and upvoted.

|

Collectives™ on Stack Overflow

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

1 Answer 1

6 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

6 Comments

Your Answer

Sign up or log in

Post as a guest

Related