This is a migrated thread and some comments may be shown as answers.

Grid inline editing cell leave event

5 Answers 732 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Rimes
Top achievements
Rank 1
Rimes asked on 05 Jan 2016, 03:01 AM

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> 

 

5 Answers, 1 is accepted

Sort by
0
Boyan Dimitrov
Telerik team
answered on 06 Jan 2016, 01:47 PM

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!
 
0
Rimes
Top achievements
Rank 1
answered on 06 Jan 2016, 08:40 PM

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

0
Boyan Dimitrov
Telerik team
answered on 08 Jan 2016, 01:03 PM

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!
 
0
Randy
Top achievements
Rank 1
answered on 14 Apr 2017, 03:45 PM

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? 

0
Konstantin Dikov
Telerik team
answered on 18 Apr 2017, 08:57 AM
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.
Tags
Grid
Asked by
Rimes
Top achievements
Rank 1
Answers by
Boyan Dimitrov
Telerik team
Rimes
Top achievements
Rank 1
Randy
Top achievements
Rank 1
Konstantin Dikov
Telerik team
Share this question
or