1

I have a controller A that sent an action with this.send('makeItHappen'), and I want to handle it in controller B. How do I do it?

JS:

// controllers/documents/datasets/controller-A
import Ember from 'ember';

export default Ember.Controller.extend({
  actions: {
    sendToDataCenter() {
      this.send('makeItHappen'); // this throws an error
    }
  }
});


// controllers/controller-B
import Ember from 'ember';

export default Ember.Controller.extend({
  actions: {
    makeItHappen() {
      console.log('It works!!');
    }
  }
});

In Controller B, it throws an error: Uncaught Error: Nothing handled the action 'makeItHappen'. If you did handle the action, this error can be caused by returning true from an action handler in a controller, causing the action to bubble.

Please, can anyone help? Thank you.

Shaoz
  • 10,573
  • 26
  • 72
  • 100
  • What is the connection between controller A and controller B ?. I mean is it parent child route respectively ?. If there is no connection then you can inject controller and call function direclty – Ember Freak Jan 16 '17 at 15:00
  • Thanks @kumkanillam, the paths are: `controllers/documents/datasets/controller-A` and `controllers/controller-B` – Shaoz Jan 16 '17 at 15:03
  • I dont find any relation between A and B controller, I mean when there is parent-child relationship then `send` will bubble to parent controller and till parent application route in hierarchy.. so you can inject and directly call `makeItHappen` function of controller-B. that's possible – Ember Freak Jan 16 '17 at 15:08

1 Answers1

3

In general, each route will have one default controller if it's not defined. In controller-A, this line of code this.send('makeItHappen'); will look for the makeItHappen method in actions hash of the datasheets,documents, application controller and its corresponding route if makeItHappen is defined anywhere then won't get this error.

To implement what you need, Currently, in your route/controller hierarchy, there is no parent-child relationship between controller-A and controller-B. so you can just inject controller-B inside controller-A and call makeItHappen directly.

// controllers/documents/datasets/controller-A
import Ember from 'ember';

export default Ember.Controller.extend({
controllerB:Ember.inject.controller('controller-B');//this should be already instantiated ie,this corresponding route should be visited earlier otherwise you will get `unknown injection: controller:users' Error
  actions: {
    sendToDataCenter() {
      this.get('controllerB').send('makeItHappen');
    }
  }
});
Ember Freak
  • 12,918
  • 4
  • 24
  • 54
  • thanks for your answer. But I want to use what Controller-A is sending in Controller-B. Is it the same technique I have to use, as in injecting the Controller-A into Controller-B? – Shaoz Jan 16 '17 at 15:24
  • This kind of requirement is odd, if you want to use just function alone then you can write it as an util file and export and include it where-ever you need. – Ember Freak Jan 16 '17 at 15:30
  • Basically all I want is send an action from an onchange event of a select dropdown with its value (in Controller-A). Then catch that in another controller (Controller-B), that's all. But I don't know how I can do that. – Shaoz Jan 16 '17 at 15:35
  • send will bubble in controller/route hierarchy, ie.,You can only catch it in the following controller files(application,documents,datasheets) or in route files (application,documents,datasheets). but not in some other controller. If you deliberately want to call some other controller file method then you need to inject particular controller and call required function. – Ember Freak Jan 16 '17 at 15:40
  • Cool! I get it now. Thanks for your help and your teachings though. – Shaoz Jan 16 '17 at 15:44