Question

I have a simple Backbone.js model:

class Avia.Student extends Backbone.Model

Told you it was simple 🙂 Anyhow, I’m saving it in the following view (snipped for clarity):

class Avia.StudentView extends Backbone.View

  render: =>
    html = JST['views/student_view_template'](model: @model)
    @el.html(html)
    Backbone.ModelBinding.bind(@)
    $('#save').bind('click', @save)

  save: (e) =>
    e.preventDefault()
    @model.save(
        success: =>,
        error: =>
    )

When I click the save button, @save() is called, but fails with the following error (again, snipped for clarity as obviously it continues for a long time):

Uncaught RangeError: Maximum call stack size exceeded
Backbone.Events.trigger:117
_.extend._onModelEvent:635
Backbone.Events.trigger:117
_.extend._onModelEvent:635
Backbone.Events.trigger:117
_.extend._onModelEvent:635
Backbone.Events.trigger:117

Could someone please tell me what I’m doing wrong? I don’t understand why this is happening …

Answer 1

You need to call super() in your collection’s and/or model’s constructor (if you have defined any). I had the same issue a couple of days ago: Omitting calling super() fails to bind the _onModelEvent object to the collection, which causes it to be invoked in an incorrect context (this is pointing to the model instead of the collection [and vice versa]).