on deleting child record, the UI is still showing DOM components associated with removed record

Question

I have a model called "question" that has many "answer" object/model. I am able to add a new answer to a question but upon deletion the UI is not getting updated, although when I checked through ember plugin in chrome, the record is getting removed from the store.

Here is the jsbin: http://jsbin.com/emUwAJan/1/

there you can click on the "add" button on the table head, this will add a new record but when you try to delete it, the answer does not get removed form the UI. What do I need to do to get rid of the deleted record from the UI?

Thanks, Dee

Answer 1

You have got to remove the answer from the collection of anwswers:

        actions:{
            delete:function(){
                var record = this.get('model');
                this.get('parentController.answers').removeObject(record);
            }
        }

bin