Flavio Copes
Flavio Copes

Reputation: 4359

How can I trigger an action programmatically?

I have this view

App.ApplicationView = Em.View.extend({
  templateName: 'application',

  actions: {
    myAction: function() {
      //
    }
  }
});

Suppose I want to trigger manually that action from another view method, such as didInsertElement, like:

App.ApplicationView = Em.View.extend({
  templateName: 'application',

  actions: {
    sidebarShowHome: function() {
      this.set('sidebarIsHome', true);
      this.set('sidebarIsNotifications', false);
      this.set('sidebarIsArchive', false);
    },
  },
    
  didInsertElement: function() {
    this.actions.sidebarShowHome();
  }
});

How could I do it? this.actions is undefined from within a view method.

Upvotes: 29

Views: 16339

Answers (3)

Nelu
Nelu

Reputation: 18680

To call an action in the same controller you can use send.

this.send('nameOfAction', someParams);

To call an action in the parent controller from a component use sendAction.

this.sendAction('nameOfAction', someParams);

Upvotes: 15

vanthome
vanthome

Reputation: 4916

The triggerAction() method only exists, if the view uses the Ember.TargetActionSupport mixin. If this is not the case, use this.get('controller').send('action'); instead.

Upvotes: 12

intuitivepixel
intuitivepixel

Reputation: 23322

You can use the TargetActionSupport mixin along with this.triggerAction:

App.ApplicationView = Ember.View.extend(Ember.TargetActionSupport, {
  templateName: 'application',
  actions: {
    myAction: function() {
      console.log('myAction');
    }
  },
  didInsertElement: function() {
    this.triggerAction({
      action:'myAction',
      target: this
    });
  }
});

By default using this.triggerAction() without parameters will send the action to the controller, however if you need to target a different destination define the target option as shown in the example.

Working demo.

Hope it helps.

Upvotes: 24

Related Questions