Delete record from nested data in view model

[harrypottar]

I have a grid with the store coming third level store nested data, load by view model formula.

I have a grid that an admin can delete a record from.

The grid store is loaded from a formula, based on two dropdowns.

store: '{currentInstanceRecord.report_emials}'

When my backend has processed I want to remove the record from the store.

The following code works, the record is removed from the grid but not the store, if I reload store again the record i still present.

            var me = this,
            reportEmailGrid = this.lookupReference('report_emails_grid'),
            rec = reportEmailGrid.getSelectionModel().getSelection()[0];
            adminUserStore = reportEmailGrid.getStore();
    
            adminUserStore.remove(rec);

Data:

{
  "ITEMS": [
    {
      "site_id": "1",
      "site_name": "xxxxxxxxx",
      "active": "1",
      "master_root_path": "xxxxxxxxx",
      "site_backup_plugin": "xxxxxxxxx",
      "mail_id": "1",
      "disk_space_used": "0",
      "instances": [
        {
          "instance_id": "1",
          "instance_name": "xxxxxxxxx",
          "active": "0",
          "instance_root_path": "xxxxxxxxx",
          "media_valet_server_url": "xxxxxxxxx",
          "media_valet_api_server_url": "xxxxxxxxx",
          "site_id": "1",
          "media_valet_username": "xxxxxxxxx",
          "disk_space_used": "0",
          "report_emials": [
            {
              "email_id": "1",
              "email_address": "xxxxxxxxx@xxxxxxxxx.com",
              "instance_id": "1"
            }
          ]
        }
      ]
    },
    {
      "site_id": "2",
      "site_name": "xxxxxxxxx",
      "active": "1",
      "master_root_path": "xxxxxxxxx",
      "site_backup_plugin": "xxxxxxxxx",
      "mail_id": "1",
      "disk_space_used": "285G",
      "instances": [
        {
          "instance_id": "2",
          "instance_name": "xxxxxxxxx",
          "active": "1",
          "instance_root_path": "xxxxxxxxx",
          "media_valet_server_url": "xxxxxxxxx",
          "media_valet_api_server_url": "xxxxxxxxx",
          "site_id": "2",
          "media_valet_username": "xxxxxxxxx",
          "disk_space_used": "169G",
          "report_emials": [
            {
              "email_id": "1",
              "email_address": "xxxxxxxxx@xxxxxxxxx.com",
              "instance_id": "2"
            },
            {
              "email_id": "2",
              "email_address": "xxxxxxxxx@xxxxxxxxx.com",
              "instance_id": "2"
            },
            {
              "email_id": "3",
              "email_address": "xxxxxxxxx@xxxxxxxxx.com",
              "instance_id": "2"
            }
          ]
        },
        {
          "instance_id": "3",
          "instance_name": "xxxxxxxxx",
          "active": "1",
          "instance_root_path": "xxxxxxxxx",
          "media_valet_server_url": "xxxxxxxxx",
          "media_valet_api_server_url": "xxxxxxxxx",
          "site_id": "2",
          "media_valet_username": "xxxxxxxxx",
          "disk_space_used": "80G",
          "report_emials": [
            {
              "email_id": "1",
              "email_address": "xxxxxxxxx@xxxxxxxxx.com",
              "instance_id": "3"
            },
            {
              "email_id": "2",
              "email_address": "xxxxxxxxx@xxxxxxxxx.com",
              "instance_id": "3"
            },
            {
              "email_id": "3",
              "email_address": "xxxxxxxxx@xxxxxxxxx.com",
              "instance_id": "3"
            }
          ]
        }
  ],
  "SUCCESS": true,
  "ERROR_MESSAGE": ""
}

View Model

Ext.define('xxxxxxxxxxxxx.view.forms.xxxxxxxxxxxxx', {
    extend: 'Ext.app.ViewModel',
    alias: 'viewmodel.siteinfoform',




    data: {
      //  mailServerAuthRequired: false
    },


    stores: {
        SiteInfo: {
            type:'siteinfo',
            autoLoad: true
        },
        MailInfo: {
            type:'mailinfo',
            autoLoad: true
        },
        AdminUser: {
            type:'adminusers',
            autoLoad: true
        }
    },
    formulas: {
        currentSiteInfoRecord: {
            bind: {
                bindTo: '{siteInfoComboBox.selection}', //--> reference configurated on the combobox view (reference: siteInfoComboBox)
                deep: true
            },
            get: function(record) {
                return record;
            },
            set: function(record) {
                if (!record.isModel) {
                    record = this.get('records').getById(record);
                }
                this.set('currentSiteInfoRecord', record);
            }
        },
        currentInstanceRecord: {
            bind: {
                bindTo: '{instanceComboBox.selection}', //--> reference configurated on the combobox view (reference: siteInfoComboBox)
                deep: true
            },
            get: function(record) {
                return record;
            },
            set: function(record) {
                if (!record.isModel) {
                    record = this.get('records').getById(record);
                }
                this.set('currentInstanceRecord', record);
            }
        },
        currentMailInfoRecord: {
            bind: {
                bindTo: '{mailInfoComboBox.selection}', //--> reference configurated on the combobox view (reference: siteInfoComboBox)
                deep: true
            },
            get: function(record) {
                return record;
            },
            set: function(record) {
                if (!record.isModel) {
                    record = this.get('records').getById(record);
                }
                this.set('currentMailInfoRecord', record);
            }
        }
    }
        
});

TIA
Harry

[harrypottar]

I got this far but now I know where the record is how do I remove it, remove and removeAt is unknown on the object.

updateInstanceReportEmail:  function(response, opts) {
		var me = this,
            foundMatch = false,
            rec = this.lookupReference('report_emails_grid').getSelectionModel().getSelection()[0]
            viewModelStore = this.getViewModel().getStore('SiteInfo');


     
        viewModelStore.each(function(record,id){
            if (record.data.INSTANCES.length > 0 ) {
                var length = record.data.INSTANCES.length;
                for(var i = 0; i < length; i++) {
                    if (record.data.INSTANCES[i].report_emials.length > 0 ) {
                        var emailLength = record.data.INSTANCES[i].report_emials.length;
                        for(var e = 0; e < emailLength; e++) {
                            if (rec.data.email_id == record.data.INSTANCES[i].report_emials[e].email_id &&
                                rec.data.instance_id == record.data.INSTANCES[i].report_emials[e].instance_id ) {
                                foundMatch = true;
                                break;
                            }
                        }
                        if (foundMatch) break;
                    }
                    if (foundMatch) break;
                }
            }
        });
    },