How can I make custom events that bubble through the view hierarchy?

ember.js

Solution

I would suggest triggering a jQuery special event and registering the event with a mapping on your Ember app. For example:

Ember.Application.create({
  customEvents: {
    // key is the jquery event, value is the name used in views
    formcancel: 'formCancel'
  }
});

And in your cancelButton view:

click: function(evt){
  Ember.$().trigger('formcancel')
}

This will bubble in the same way that other mapped Ember DOM events do.

Problem

I have button views that are part of a set of Ember.js form helpers I wrote. E.g. MyAddressFormView has the following template: ``` {{#form}} {{textArea address}} {{submitButton}} {{cancelButton}} {{/form}} ``` To handle the "Submit" button, I let the "submit" form event bubble, and handle it in the `submit` method of MyAddressFormView. But how do I do the same for the "Cancel" button? For instance, is there any way I can trigger a custom "cancel form" event in a child view, let it bubble, and handle it in an ancestor view?

Original source