Kendo Grid proper way of clearing a cell content in an event

7 posts, 0 answers
  1. Dvorak
    Dvorak avatar
    3 posts
    Member since:
    May 2013

    Posted 09 May 2013 Link to this post

    In my save event of Kendo Grid, I'd like to clear the content of the cell being saved based on a condition.

    var SALE_01_DIV_GRID = $("#SALE_01_DIV_GRID").kendoGrid(
    {
       columns: [
       { title: "SAP Code", field: "SAP_CD" }
       ...
       ...
       ,save: function(e)
       {
           var editedIndex = $("#SALE_01_DIV_GRID tr.k-grid-edit-row").index();

           if(!isSapCodeValid(e.values.SAP_CD)) {
           this._data[editedIndex].SAP_CD = ""; //Doesn't Work
         }

       }
    });

    For some reason, setting the data of the cell I'd like to be cleared to an empty string doesn't do the job. I'm assuming this is because the save event is propagated to a different place and resetting the cell content.What's the proper way of clearing a cell within an event like this?
  2. Alexander Valchev
    Admin
    Alexander Valchev avatar
    2895 posts

    Posted 10 May 2013 Link to this post

    Hi Dvorak,

    The proper way for doing this is to edit the model values through the set method. The model can be obtained from event parameters.

    save: function(e) {
        var model = e.model;
     
        model.set("SAP_CD", "");
    }


    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. Curt Rabon
    Curt Rabon avatar
    79 posts
    Member since:
    Dec 2008

    Posted 25 Jul 2017 in reply to Alexander Valchev Link to this post

    If you're using In-Cell editing, this answer is not correct.  Yes model.set() is the proper way to update a model field, but any change to the model field that's being saved in the "save event", will be discarded by the grid.  It seems the Save event is not designed to let you alter the value of the field that's being saved. Changes to other model fields in the save event will work.

    Assuming the field is type string and you are using the default editor put in place by the grid, is there a way to alter the value of the model field being saved, and inside the save event?

    There's the dataSource change event and checking for action == "itemchange".  Is that the only way to do it?

    Thanks.

  4. Konstantin Dikov
    Admin
    Konstantin Dikov avatar
    2466 posts

    Posted 27 Jul 2017 Link to this post

    Hello Curt,

    With "incell" edit mode you should call the preventDefault method before changing the value. Please refer to the following dojo example (for the "name" column):

    Best Regards,
    Konstantin Dikov
    Progress Telerik
    Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
  5. Curt Rabon
    Curt Rabon avatar
    79 posts
    Member since:
    Dec 2008

    Posted 27 Jul 2017 in reply to Konstantin Dikov Link to this post

    Thank you.  I should have mentioned that I also use the dataSource "requestStart" event, and if dataSource.hasChanges() reports yes, I prompt the user to save or not.  Regardless of the user choosing OK or cancel, I let the new request continue, but if they choose OK, then I call dataSource.sync().  This lets the changes get saved and then the new request complete (like paging/sorting/filtering on server-side).

    When using this technique, calling e.preventDefault() in the grid's save event *does* work and let the screen and model be updated, but when the new requestStart happens, it does not detect any "dirty" rows.

    By using the dataSource's change event and checking e.action === "itemchange" && e.field === my field, and using model.set() there, then grid detects a change when the new request starts.

  6. Preslav
    Admin
    Preslav avatar
    591 posts

    Posted 31 Jul 2017 Link to this post

    Hello Curt,

    Based on your last post, I am not sure if you require any further assistance.

    That said, if you require any further help, could you please elaborate on the information that we could provide?

    I look forward to your reply.


    Regards,
    Preslav
    Progress Telerik
    Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
  7. Curt Rabon
    Curt Rabon avatar
    79 posts
    Member since:
    Dec 2008

    Posted 31 Jul 2017 in reply to Preslav Link to this post

    I do not need further assistance.  Thanks.
Back to Top