Question

I have this backbone script, which has a single view and a model acting as a controller, and a collection where data is being fetched from the server url: '/search/:term' .

    var Items = Backbone.Collection.extend({
          initialize: function(terms){
            this.fetch();
        }
          url: 'search/:term'
    });

   var Controller = Backbone.Model.extend({
       defaults:{
        term: ""
     },
      initialize: function(opts){

        this.on('change:term', function(term){
            console.log(this.get("term"));
          // every time term changes i want to refresh the collection with the new data
          // so it will fetch data from url:'search/ + term'
        });

could someone help me with this thank you.
}
});

Answer 1

In a backbone context a View acts as a Controller (read controller form mvc). Can you try to do something like this?

YourView = Backbone.View.extend({
  events : { 
    'change #dom-id' : 'handleChange' //function to fire when you change the dom
  },
  initialize: function(){
    this.collection.bind("reset", updateView); //when collection is done, updateView fires
  }, 
  render: function(){
    //do your render logic here, use a template etc.. //initial rendering
  },
  handleChange : function(changeEvent){
    //get value from dom-element, tell the collection to 
    //fetch again with the new term
  },
  updateView : function(){
    //Code that fires when the collection is done fetching 
  }
});