Strange behavior with Datatable combined with DataCollection?

I think I’ve discovered a bug, or, at least, a strange behaviour with Datatable combined with DataCollection.

// models/applications
export const dataApplications = new webix.DataCollection({
    url: "/applications",
    save: "rest->/applications"
});

If you look at the code below, the SCENARIO 1 will work properly:

• data edited in the datatable is pushed to the db
• date deleted from the datatable is removed from the db

SCENARIO 2 (we use the parameter ‘data’ instead) :

• data edited in the datatable is pushed to the db
• data deleted from the datatable is NOT removed from the db, so, if I reload the datatable, the deleted record comes back in place… (actually, I checked and there is no ajax request sent in the debugger)

// views/applications
import { JetView } from "webix-jet";
// import { dataApplications } from "models/applications"; <= SCENARIO 2

export default class ViewAccountAppsTable extends JetView {
    config() {
        return {
            id: "grid-applications",
            view: "datatable",
            url: "/applications", // <= SCENARIO 1: we use 'url'
            save: "rest->/applications", // <= and 'save' params

            editable: true,
            editaction: "dblclick",
            select: "row",

            // data: dataApplications, // <= SCENARIO 2 : we use 'data'

            columns: [
                {....some columns.....},

                // Delete button
                { header: "Delete", template:
                     function(obj) {
                          return "<div class='delete_app'>
                                          <button class='webixtype_base'>
                                              Delete
                                           </button>
                                       </div>"
                           } 
                 }
            ],

            onClick: {
                "delete_app": function(event, id, node) {
                    this.remove(id);
                }

            }
        }
    }

To remove the record, I’ve also tried other syntax, but same behavior in the end (the record is NOT deleted from the db if I use the DataCollection):

//$$("grid-applications").remove(id);
//$$("grid-applications").remove($$("grid-applications").getSelectedId());

Hi David,

The thing is that add and remove methods should be called directly from the Data Collection, as it acts a a master for the synced views and only it has a right to perform such operations. At the same time updates go in both directions.

You can follow the snippet to catch it: https://webix.com/snippet/79628c2b

YOU ARE AMAZING

This was the problem => I’ve used the ‘remove’ method against the datatable itself instead of the DataCollection.

SOLVED !
Thank you very much for your time.

Helga, can I make a suggestion?

Your snippets are an invaluable resource, and it would deserve to:

1. Have a searchable title added to them

2. Have an index page listing all those titles, so that people can directly browse in the library of existing snippets.

This would also save energy to your support team, because I imagine the same questions come again and again… Everybody doesn’t have time to browse all the forum threads to check if a solution already exists, but browsing a simple list of snippets demonstrating various use cases would be very fast.

My two cents!
Regards.