handling action in view not router

Question

I have a view that has expandable/collapsable content that I'd like to be able to toggle by clicking the on the table row. Before pre1.0, I had this in the template:

<tr {{action "expand"}}>

which was previously handled on my view:

App.ContentRowView = Em.View.extend({
   templateName: 'ember/templates/content/row',
   expand: function() {
      this.set('isExpanded', !this.get('isExpanded'));
   },
   isExpanded: false
});

However, after upgrading to pre1.0 the action is now fielded directly by the router. This makes sense in a lot of situations, but in this case the expansion is really a view concern. I've tried just replacing this with a click event handler without luck.

Is there a best practice on how to handle a view concern event like this with pre1.0?

Answer 1

Deprecated Answer

---

Even if the answer of @outside2344 works, I think it's not exactly right. Indeed parentView does not represent the view, but the parentView of its parentView. Since 1.0-pre, views preserve their context, so in the template, this represents the parentView, parentView represents parentView.parentView, and view represents the current view. Here is a fiddle to illustrate this: http://jsfiddle.net/Sly7/cnmJa/

For me the answer is {{action expand target="view"}}

EDIT (answering to @Gal Ben-Haim)

Action helpers behave little different in a router-based application. Quote from the documentation:

In Router-driven applications, if an action is not intercepted by a view, that event will bubble up to the Route in which that view was rendered. If that Route is a sub-route of another Route the transition will be sought there all the way up to the top-level Route definition, our über-container: root.

This bubbling effect allows certain actions to remain private. If certain transitions should only be available for certain sub-sub-states, put the transition on the sub-state and you've achieved a type of scoping.

Basically, for me that means in Router-driven apps if you don't explicitly define a target in the action helper, it is sent to the router.

---

Updated answer

I think now the guides answer very well to this question. see http://emberjs.com/guides/templates/actions/#toc_specifying-a-target

Answer 2

In pre1.0 you can make the view field the action by adding target="parentView" to the action:

{{action "expand" target="parentView"}}