CODEWITHSUNDEEP
ember.js
Tudor Vintilescu
Tudor Vintilescu

Reputation: 1460

Ember - Rolling back model after edit cancel

I've been having some trouble with the following situation.

I have a resource, let's call it 'user', which has two nested sibling resources, 'actions' and 'dates', thereby having the two routes:

/user/actions
/user/dates

The user template is something along the lines of:

{{user.name}}

{{outlet}}

with the target of displaying the 'actions' and 'dates' lists associated with the user in the outlet.

This works fine, but I would also like to be able to click on the username and change it, namely edit it so the template would look something along the lines of:

{{#unless inedit}}
    <span {{action='triggerUsernameEdit'}}>{{user.name}}</span>
{{else}}
    {{input value=user.name}}
    <button {{action='saveChanges'}}>Save</button>
    <button {{action='cancelChanges'}}>Cancel</button>
{{/unless}}
{{outlet}}

I am NOT using Ember Data, and this works well up until I try to revert to the original model. I am looking into cloning the model in the UserRoute and then setting back the original 'username' field, but don't know if this would be the correct way to go.

I've seen other examples where the edit action would be handled on a different sub-route, let's say:

/user/usernameEdit

but I think that would make the 'actions' or 'dates' lists to disappear, which I don't want.

Any help would be greatly appreciated.

Upvotes: 1

Views: 125

Answers (1)

Kingpin2k
Kingpin2k

Reputation: 47367

If you're attempting to do a rollback, create a copy.

Large (multiple fields) or small (single field) scale, it's a copy. Bind to the copied items and allow them to edit those, on commit, you merge the copy into the original. On cancel, destroy the copy.

Switching routes will still present the same problem, you will still either have to bind to the original model, or a copy.

Upvotes: 1

Related Questions