1

I initialise the View:

notifications = new tvr.notifications.Collection
notifications.fetch()
new tvr.notifications.View collection:notifications

Im adding "notifications" to a backbone collection:

notifications =  new tvr.notifications.Collection
notifications.fetch()
notifications.create html:this_notification

notifications.coffee

    class Notifiction extends Backbone.Model
    class Notifictions extends Backbone.Collection
        model = Notifiction
        localStorage: new Backbone.LocalStorage 'tvr.notifications'


    class NotificationView extends Backbone.View
        initialize: ->
            @listenTo @collection, "add", @update

        update: ->
            alert "update"

    namespace 'tvr.notifications', (exports) ->
        exports.Model = Notifiction
        exports.Collection = Notifictions
        exports.View = NotificationView

this events are never called, I can see the objects created in the collection.

I just want to know when A new one is added, or deleted from the collection, so I can update a badge number in the HTML.

gherkins
  • 14,603
  • 6
  • 44
  • 70
Harry
  • 13,091
  • 29
  • 107
  • 167

1 Answers1

1

You are trying to bind the "Add" event to a function call, which is not possible. You need to bind the event to a function reference and Backbone's event mechanism will call the function that is referenced on your behalf. Without using alert, here is an example of the difference (in JavaScript).

Function to invoke

var myFunc = function() {
    alert("happy days");
}

Illegal

notifications.on("add", myFunc());

Legal

notifications.on("add", myFunc);

So you can see in your example you are trying to call the alert function and pass an argument of "happy days" when you bind it using on. This is not allowed.

However if you write a parameter-less function that wraps the code you would like to call such as in the myFunc example above and assign it to a variable or other object, you can bind the event to the function's reference. This should then behave the way you are expecting.

Lastly, you should bind the event using listenTo, not on. This is for reasons already discussed on SO. For further reference read the following:

Difference between ListenTo and on

Backbone js .listenTo vs .on

Community
  • 1
  • 1
dcarson
  • 2,853
  • 1
  • 25
  • 34
  • I did as you explained, but this does not work. I updated my question – Harry Jul 10 '13 at 12:25
  • You may need a `_.bindAll(this)` as the first line of your `initialize` function. Also, I can't see any evidence you are adding models to the `Notifictions` collection. you don't even have a reference to it in your example as you `new` it in the `listenTo` function. So how can you be adding models to it? – dcarson Jul 10 '13 at 12:55
  • Its in the question, line 1 and 2. ill try bindAll – Harry Jul 10 '13 at 13:40
  • I think I know whats wrong, the **View** is listening to the collection events and you never pass the view the collection you call `create` on. You need to pass the `notifications` collection to the view as a parameter opon initialization. **Before** you call `create` on the collection`. Also, change `@listenTo new Notifictions, "add", @upate` to `@listenTo @collection, "add", @upate` (or similar, my coffeescript aint the best :) – dcarson Jul 10 '13 at 13:49
  • bindAll does not work , this guy had the same issue http://stackoverflow.com/questions/9627598/backbone-collection-create-not-triggering-add-in-view – Harry Jul 10 '13 at 13:52
  • Yup I tried that to, I added the collection to View before anything was done to the collection as you suggested and in the other question I posted above. – Harry Jul 10 '13 at 13:54
  • Are you calling the first 5 lines of code in that order? If so, delete line 4 and swap lines 2 & 3. – dcarson Jul 10 '13 at 14:00
  • let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/33203/discussion-between-harry-and-dcarson) – Harry Jul 10 '13 at 14:06