Grid inline editing cell leave event

6 posts, 0 answers
  1. Rimes
    Rimes avatar
    2 posts
    Member since:
    Jan 2016

    Posted 04 Jan 2016 Link to this post

    Hi 

    I have been reading that there is a save event which gets triggered when a cell is left in the grid. I tried that and its working fine when I use GridEditMode.InCell as the edit mode. When I use GridEditMode.InLine nothing happens when I leave the cell (the function is not being called). But, the function is being called after i click on the "Update" button. In my scenario, i need to update some cells regarding to what was written in some other cells, so no use for me to call the function just before saving. So is there a method to notify me just when a cell has been left (or a value inside of a cell has been changed or selected e.g. from an autocomplete)

     

    Here is my code

     

     @(Html.Kendo().Grid<Telerik2.Models.LeistungViewModel>()
            .Name("grid")
            .Columns(columns =>
            {
                columns.Bound(l => l.LeistungNr).Width(240).Visible(false);
                columns.Bound(l => l.Bezeichnung).Width(190);
                columns.Bound(l => l.Datum).EditorTemplateName("DatumPicker").Width(110).Format("{0:dd.MM.yyyy}");
                columns.Bound(l => l.MinT).Width(110); ;
                columns.Bound(l => l.Kuerzel).EditorTemplateName("LeistungKuerzel").Width(130);
                columns.Bound(l => l.MinV).Width(110);
                columns.Bound(l => l.Person).Width(160);
                columns.Command(command => { command.Edit().Text("Bearbeiten").UpdateText("Speichern").CancelText("Abbrechen"); }).Width(200);
                
            })
            
            .ToolBar(toolbar => toolbar.Create())
                    .Editable(editable => editable.Mode(GridEditMode.InLine))
                    .Pageable()
                    .Events(events => events.Save("Save"))
                    .Sortable()
                            .Resizable(resize => resize.Columns(true))
                    .Scrollable()
     

    )

    <script type="text/javascript">
        function Save(e) {
            console.log("Cell left");
                }
        }

    </script> 

     

  2. Boyan Dimitrov
    Admin
    Boyan Dimitrov avatar
    2062 posts

    Posted 06 Jan 2016 Link to this post

    Hello Rimes,

     

    Indeed the model is not updated until user clicks on the "Update" button in "inline" edit mode. A possible solution is to bind to the blur event of the text box elements. A suitable event to bind editor text box to the blur event is to use the edit event of the Kendo UI Grid. 

     

    Regards,
    Boyan Dimitrov
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
  3. Rimes
    Rimes avatar
    2 posts
    Member since:
    Jan 2016

    Posted 06 Jan 2016 Link to this post

    Hi Boyan,

     

    thanks for the answer. Before i try that, i will ask something else.

    Is it possible to somehow "open" all cells in Edit Mode when "Incell" is selected as the grid edit mode ? Actually Incell suits more my needs, because i want to be able to edit data without clicking on the edit button. But the problem with InCell is that i cannot jump (with tab for example) from one cell to another (inside of one row). So, is there a way to  enable that for InCell mode, because then i would have all the functionality i need

     

    Regards

    Semir

  4. Boyan Dimitrov
    Admin
    Boyan Dimitrov avatar
    2062 posts

    Posted 08 Jan 2016 Link to this post

    Hello Rimes,

     

    Actually if the navigatable option of the Kendo UI Grid is enabled the tab key should navigate between cells on the row and switch to edit mode. For example this option is enabled in our Grid / Batch editing demo. 

     

    Regards,
    Boyan Dimitrov
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
  5. Randy
    Randy avatar
    75 posts
    Member since:
    Jul 2009

    Posted 14 Apr 2017 in reply to Boyan Dimitrov Link to this post

    Hi Boyan,

    In this thread you suggested binding to the blur event of the text box elements when a grid fires the edit event. How would I go about getting a reference to the text box elements of all the cells in the row being edited in inline mode? 

  6. Konstantin Dikov
    Admin
    Konstantin Dikov avatar
    2466 posts

    Posted 18 Apr 2017 Link to this post

    Hello Randy,

    Please refer to the answer in the other forum thread that you have opened:
    On a side note, for all sides convenience and for better tracking of the issues, please try to avoid posting one question in multiple threads. Thank you for your understanding.


    Regards,
    Konstantin Dikov
    Telerik by Progress
    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.
Back to Top