akveo / ng2-smart-table

Angular Smart Data Table component
https://akveo.github.io/ng2-smart-table/
MIT License
1.63k stars 877 forks source link

Delete not working? #1138

Open AllTerrainDeveloper opened 4 years ago

AllTerrainDeveloper commented 4 years ago

When I delete a row, the row disappears from the view, but it is still present in the data source. So when pushing data to server (with source.getAll()), anything has changed.

I am using internal mode, and also, no event is raised when I try to delete it. On settings i have delete.confirmDelete = true;

on html: (deleteConfirm)="onDeleteConfirm($event)"

on ts:

onDeleteConfirm(event) {
    if (window.confirm('Are you sure you want to save?')) {
      //call to remote api, remember that you have to await this
      event.confirm.resolve(event.newData);
    } else {
      event.confirm.reject();
    }
  }

but it is never called...

Checked everything already in the docs: https://akveo.github.io/ng2-smart-table/#/documentation

Any ideas?

vicenthy commented 4 years ago

did you try to call the load method?

AllTerrainDeveloper commented 4 years ago

What do you mean by calling hte load method? I load data, then I remove a row, and load old data? I don't get it. Can you elaborate please?

vicenthy commented 4 years ago

I think that you did could manually update with refresh method or load method

mohammad0omar commented 4 years ago

why pushing all the data to the server? when the delete method is called the just send the id deleted to the backend

tarunsinghal92 commented 4 years ago

There seems to be condition issue at https://github.com/akveo/ng2-smart-table/blob/master/projects/ng2-smart-table/src/lib/lib/data-source/local/local.data-source.ts#L50

For now, here is a hack that should work.

// smart-table config
{
        ...
        actions: {
          delete: true,
          ...
        },
        delete: {
          deleteButtonContent: 'Delete',
          confirmDelete: true
        },
        columns: {...}
}

// define deleteConfirm in element
<ng2-smart-table 
    ...
    [settings]="config" 
    [source]="value"
    (deleteConfirm)="onDeleteConfirm($event)"
/>

// write onDeleteConfirm like below
public onDeleteConfirm(event) {
    this.value = event.source.data.filter((d: any) => !isEqual(d, event.data));
    event.confirm.resolve();
  }

isEqual is a lodash function that deep compares both the object.

In short, remove the element urself using the datasource.