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

In Cell Editing With Editor Templates

2 Answers 203 Views
This is a migrated thread and some comments may be shown as answers.
Matt Miller
Top achievements
Rank 1
Matt Miller asked on 14 Nov 2013, 06:03 PM
I'm trying to implement in-cell editing on a kendo ajax bound grid. All of my columns have a editor template. I have a client side javascript function that is called in the grid's save event.

Here is the grid definition 

@( Html.Kendo().Grid<CNX.Domain.Entities.CnxTrain>()
       .Sortable(sorting => sorting.SortMode(GridSortMode.SingleColumn))
       .Editable(editable => editable.Mode(GridEditMode.InCell))       
       .Columns(columns =>
                    columns.Bound(x => x.Id).Visible(false);
                    columns.Bound(x => x.STANDARD_CARRIER_ALPHA_CODE).Width(75).EditorTemplateName("_textEditor");
                    columns.Bound(x => x.UNIT_TRAIN).Width(75).EditorTemplateName("_textEditor");
                    columns.Bound(x => x.CNX_AUT).Width(75).EditorTemplateName("_textEditor");
                    columns.Bound(x => x.ARRIVAL_DATE_TIME).Width(100).Format("{0:MM/dd/yyyy hh:mm:ss}").EditorTemplateName("_dateTimeEditor");
                    columns.Bound(x => x.PERMIT_NUMBER).Width(100).EditorTemplateName("_textEditor");
                    columns.Bound(x => x.SHIPPER_NAME).Width(100).EditorTemplateName("_textEditor");
                  //  columns.Bound(x => x.CNX_RELEASE_DATE_TIME).Width(100).Format("{0:MM/dd/yyyy hh:mm:ss}").EditorTemplateName("_dateTimeEditor");                  
        .Events(ev => ev.Save("incompleteTrains_Save"))
        .DataSource(dataSource => dataSource.Ajax().PageSize(5).Read(read => read.Action("IncompleteTrains", "MenuTrain").Type(HttpVerbs.Post))
                                                               .Update(update => update.Action("IncompleteTrainsUpdate", "MenuTrain", Model).Type(HttpVerbs.Post))
                                                               .Model(model => model.Id(x => x.Id)))
@model string
@Html.TextBoxFor(m => m , new {@class = "k-input k-textbox"})
@(Html.Kendo().DateTimePickerFor(m => m).Format("MM/dd/yyyy hh:mm:ss").Name("DateTimeEditor"))
Here is the client side javascript function 
function incompleteTrains_Save(e) {
        var dateValue;
        var timeValue;
        if (e.values.DateTimeEditor != null) {
            dateValue = e.values.DateTimeEditor.toDateString();
            timeValue = e.values.DateTimeEditor.toTimeString();
            e.model.set("ARRIVAL_DATE_TIME", new Date(e.values.DateTimeEditor.toDateString() + ' ' + e.values.DateTimeEditor.toTimeString()));
        else {
            var objGet = e.values.get();
            var objSet = valueOf(e.values);
            e.model.set(e.values.get(), valueOf(e.values));
i need to figure out a way to set the model fields based on e.values in a generic way rather than having to specify the model field specifically like shown for the datetime editor.

something like e.model.set(e.values.???? , val(e.values.???))

Thanks in advance

2 Answers, 1 is accepted

Sort by
Petur Subev
Telerik team
answered on 18 Nov 2013, 12:38 PM
Hello Matt,

How to iterate through the properties of an object (in your case e.values) is a general question for the JavaScript language. Check the following question on SO:
You can use the same approach to make your function more generic.

Kind Regards,
Petur Subev
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Matt Miller
Top achievements
Rank 1
answered on 18 Nov 2013, 12:56 PM
Thanks, i had found a link that helped me perform reflection on the text fields being passed to the function. Which isn't 100% where i wanted to get it, but definitely better. 
Asked by
Matt Miller
Top achievements
Rank 1
Answers by
Petur Subev
Telerik team
Matt Miller
Top achievements
Rank 1
Share this question