I have a show view that displays the selected item from a list. Then when i click on the edit button it displays the edit view via {{#if isEditing}}

When I click another item in the list the display view changes to the new selected item but stays in the isEditing state.

How can I change the isEditing state of a view from another view ?

I have done this at the moment with a FocusOut function that sets isEditing to false but I have 2 text fields in this view and so when I click into the other text field it triggers the focusOut function as well.

This must be simple but can't seem to figure it out!

I have a show view that displays the selected item from a list. Then when i click on the edit button it displays the edit view via {{#if isEditing}}

When I click another item in the list the display view changes to the new selected item but stays in the isEditing state.

How can I change the isEditing state of a view from another view ?

I have done this at the moment with a FocusOut function that sets isEditing to false but I have 2 text fields in this view and so when I click into the other text field it triggers the focusOut function as well.

This must be simple but can't seem to figure it out!

• javascript
• ember.js

• well i have ended up doing this but its not pretty and i'm sure it's not the correct way !! @get('parentView').get('parentView').get('childViews')[1].set('isEditing', false) – Rick Moss Commented Feb 2, 2012 at 23:55

3 Answers 3

Nice question. I think you need to do something a little more plicated than a simple binding to drive the content of the App.SelectedItemView. I would try another puted property instead:

App.SelectedItemView = Ember.View.extend({
  isEditing: false,
  content: function() {
    var selectedItem = App.SelectedItemController.get('content');
    this.set('editingItem', false);
    return selectedItem;
  }.property('App.SelectedItemController.content'),
});

The trick about puted properties is that you can acplish the same thing as a simple binding, but you can also add custom code to execute when the observed value changes (like conditionally setting editingItem to null in this case). The downside to a puted property is that it's a little more plicated to do a two-way binding (e.g. in this case to set App.SelectedItemController.content whenever App.SelectedItemView.content changes)--but it sounds like you don't need to do that anyway.

How can i change the isEditing state of a view from another view ?

I don't think this is really want you want to do. In the click event for the item you are probably changing the content property of the controller. You want isEditing to be false whenever the content changes.

You can set up an observer to handle this:

App.SelectedItemView = Ember.View.extend(
{
    isEditing: false,
    contentBinding: 'App.SelectedItemController.content',
    contentChanged: function ()
    {
        this.set('isEditing', false);
    }.observes("content")
});

You wouldn't want two views to be logically connected directly like this - rather, you would want this correlation to happen either through a binding (probably not in this case since the edit butotn seems to not be tied to a model or property?) or through a function in the controller layer?