Search code examples
spine.js

Spine not proxying an event handler


I've been following a spine in javascript sample code that that I've found. It appears that the sample and the current version of spine differ a bit, since I've got almost exactly the same code. The uptick is one of my calls is not getting proxed.

exports.UrlsList = Spine.Controller.create({
  elements: {
      ".items": "items",
      "form": "form",
      "input": "input"
  },
  events: {
    "submit form": "create"
  },

  proxied: ["render", "addAll", "addOne"],

  init: function(){
    Url.bind("create",  this.addOne);
    Url.bind("refresh", this.addAll);
  },

  addOne: function(url){
    var view = Urls.init({item: url});  // The is another controller
    this.items.append(view.render().el); //This is where the error occurs
  },

  addAll: function(){
    Url.each(this.addOne);
  },

  create: function(e){
    e.preventDefault();
    var value = this.input.val();

    if (value) {
      Url.create({content: value});
    }

    this.input.val("");
    this.input.focus();
  }
});

When the addOne function gets called it's called in the context of a Url, not in of the current class. It appears to not be proxying anything, even though addOne is in the proxy list. Any ideas?


Solution

  • Spine moved away from the proxied array usage recently.

    Instead, you should be able to remove the array and use the proxy function:

    init: function(){
        Url.bind("create", this.proxy(this.addOne));
        Url.bind("refresh", this.proxy(this.addAll));
    },
    
    addAll: function(){
        Url.each(this.proxy(this.addOne));
    },