Search code examples
javascriptember.jstransactionsjsbin

Model Delete Record Ember


I have reproduced in this example my problem, i have created the actions to add and remove transactions in an invoice, the problem is that in my Ember-data the transaction removed is not deleted in the record.

this the code where i am doing something not correct

  actions: {
    add: function() {

      var transactionRecord = this.store.createRecord('transaction', {
        name: 'new transaction', 
        isChecked: false
      }); 

      return this.get("model.transactions").addObject(transactionRecord);
    },

   remove: function() {
      var allSelectedItems = this.get("model.transactions").filterBy("isChecked", true);
      return this.get('model.transactions').removeObjects(allSelectedItems).deleteRecord(transactionRecord);
    },
  }

<td><button {{action "add"}}>Add New Transaction</button>
<button {{action "remove"}}>Remove Transaction</button></td>

Although i am able to remove the transaction object, when i debug i can still see the transaction in the record data

The transaction to be deleted is the one checked

I attach the images showing the issue:

Before Delete

Before Delete

After Delete

enter image description here

As you can see the num transactions is still 3 after removing it

What i am doing wrong in deleting the record?


Solution

  • You probably need to iterate over the array and delete each record individually:

    remove: function() {
          var allSelectedItems = this.get("model.transactions").filterBy("isChecked", true);
          this.get('model.transactions').removeObjects(allSelectedItems)
    
          allSelectedItems.forEach(function(item) {
              item.deleteRecord();
          });
        }
    

    Also, actions never return anything so no need for the return.