MVC Grid DataSource Change Event

[Lee]

When the field Changed is a certain field ("WelderStencil").  I want to get the value of the field and got the server to retrieve additional data.  I want to then plug the data into the next cell in the grid "WelderName".  Then tab to the next cell where the user is going to do some data entry.  This is proving extremely complex for some reason.  I was using the selectedDataItems but then realized that when adding a new row nothing is selected.  

1) How do I get to the modified data on the DataSource Change Event

2)  After Making a call to the Server and returning the data needed.  How do I plug it into the datasource and have it refresh immediately

3)  Then how do I tab or set focus to the 3rd column.

Thanks

Lee

[Lee]

 function gridChange(e) {
        editsMade = true;

        try {

            var fieldName = e.field;

            if (fieldName == "WelderStencil") {

                var stencil = e.items[0].WelderStencil;

                //Get Welder Information for Stencil
                var url = '@Url.Action("GetWelderByStencil", "ContinuityLog", "Yes")';
                $.post(url, { stencil: stencil },
                function (data) {
                    if (data.Success != true) {

                        var confirmation = confirm("This Stencil does not exist.  Do you want to add a new Welder?", "Yes", "No")
                        if (confirmation) {
                            $("#new_welder_window").data("kendoWindow").center().open();
                            $("#new_welder_window").data("kendoWindow").refresh();
                        } // end of confirmation is true
                    } // End Get Welder Information
                    else {
                        e.items[0].WelderName = data.WelderName;
                     }
                }); // end of function

            }
        }

 

....

I figured it out.  Everything accept the tab.  And the WelderName isn't visible until after I tab off of the cell.  But I'm getting close.

Thanks.  Hope this maybe helpful to someone else having similar issue.

 

[Stefan]

Hello, Lee,

I'm glad that most of the requirements are completed.

I can suggest using the edit event of the Grid to retrieve the cell index of the currently edited cell:

https://docs.telerik.com/kendo-ui/api/javascript/ui/grid#events-edit

https://docs.telerik.com/kendo-ui/api/javascript/ui/grid#methods-closeCell

Then once the value is set, to add the ".k-state-focused" class to the closest td element of the one retrieved on the edit event. Please have in mind that indexes have to be used, as when the Grid is refreshed the reference to the DOM element will be lost, as the DOM element will be different.

If additional assistance is needed, please provide a fully runnable example and I will gladly assist further.

Regards,
Stefan
Progress Telerik