Destroy question

2 posts, 0 answers
  1. Rich
    Rich avatar
    22 posts
    Member since:
    Feb 2012

    Posted 25 Mar 2013 Link to this post

    On the destroy event in a grid, I need to have it remove it from the grid and set a delete flag so that when I hit sync it will remove it from the remote database. Right now it saves to localstorage (so they can close the browser and come back to it) then you can sync it up. Problem is that deleting it from the local database means it doesn't send anything to the server to tell it should be deleted. If there is a way to change the "Venue" line to read "deleted" or something then I can parse that out, but I'd want it to not show.

    Hopefully that makes some sense.

    Here is the delete in the grid call.
    command : [{
        name : "delete",
        text : "Del",
        click: removeLine,
    }],

    Here is the removeLine function:
    1.function removeLine(e) {
    2.  console.log('removeLine');
    3.  e.preventDefault();
    4.  var dataItem = $(e.currentTarget).closest("tr");
    5.  console.log(dataItem);
    6.}
    Here is my datasource:
    01.dataSource = new kendo.data.DataSource({
    02.    change : function() {
    03.        var dataSourceJson = JSON.stringify(dataSource._data);
    04.        console.log(dataSourceJson);
    05.        // Set Datasources into localstorage
    06.        localStorage.setItem('dataSource', dataSourceJson);
    07.    }, data : products, pageSize : 20, schema : {
    08.        model : {
    09.            id : "ID",
    10.            fields : {
    11.                ID  : {
    12.                    Type: "number"
    13.                },
    14.                Venue : {
    15.                    type : "string"
    16.                }, Match : {
    17.                    type : "number"
    18.                }, Team : {
    19.                    type : "number"
    20.                }, Alliance : {
    21.                    type : "string",
    22.                }, DO : {
    23.                    type : "string"
    24.                }, CP : {
    25.                    type : "number"
    26.                }, AP : {
    27.                    type : "number"
    28.                }, AF : {
    29.                    type : "number"
    30.                }, TP : {
    31.                    type : "number"
    32.                }, TF : {
    33.                    type : "number"
    34.                }
    35. 
    36.            }
    37. 
    38.        }
    39.    }
    40.});
  2. Alexander Valchev
    Admin
    Alexander Valchev avatar
    2875 posts

    Posted 27 Mar 2013 Link to this post

    Hello Richard,

    In order to remove item from the DataSource, you should use the removeRow method of the Grid or remove method of its DataSource. When you call the sync method of the DataSource, removed rows will be submitted through the destroy transport.
    function removeLine(e) {
        e.preventDefault();
        var row = $(e.currentTarget).closest("tr");
        this.removeRow(row); //delete
        this.saveChanges(); //sync
    }

    Currently your dataSource uses local data (there is no transport). If you expect the item to be submitted, you should bind the dataSource directly to the remote service through Ajax transport.

    I hope this information will help.

    Kind regards,
    Alexander Valchev
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  3. Kendo UI is VS 2017 Ready
Back to Top