Todo items are not saved on checkbox change testing with a backend app #17
Description
Hi,
I was testing this ember-cli example project with a Rails API only application. I found an issue when clicking on the checkboxes to complete items where the isComplete attribute is not updated in the backend server. It seems to happen because there is no code invoking save when checkboxes changes in the UI.
I know this is not a problem if you're running this application with the provided data adapter, however it may be nice to have the application prepared to be integrated with backend applications.
#6 fixes the problem. We also tested with the following code that seems to be the smallest change to have this issue fixed (thanks @juanazam for this code!):
diff --git a/app/components/todo-item/component.js b/app/components/todo-item/component.js
index 445b49d..9a04b85 100644
--- a/app/components/todo-item/component.js
+++ b/app/components/todo-item/component.js
@@ -9,6 +9,18 @@ export default Ember.Component.extend({
this.set('isEditing', false);
},
+ completeTodo: Ember.computed({
+ get() {
+ return this.get('todo.isCompleted');
+ },
+ set(key, value) {
+ this.set('todo.isCompleted', value);
+
+ this.send('save', this.get('todo'));
+ return value;
+ }
+ }),
+
actions: {
editTodo() {
this.set('isEditing', true);
diff --git a/app/components/todo-item/template.hbs b/app/components/todo-item/template.hbs
index 8c2c8fe..a195f9b 100644
--- a/app/components/todo-item/template.hbs
+++ b/app/components/todo-item/template.hbs
@@ -3,7 +3,7 @@
focus-out='save'
insert-newline='save'}}
{{else}}
- {{input type='checkbox' checked=todo.isCompleted class='toggle'}}
+ {{input type='checkbox' checked=completeTodo class='toggle'}}
<label {{action 'editTodo' on='doubleClick'}}>{{todo.title}}</label>
<button {{action 'removeTodo'}} class='destroy'></button>
{{/if}}Do you plan to merge #6 soon? If that happens, this issue will be over. Otherwise, let me know if you want me to create a different PR with the specific fix for this problem.
Cheers!