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

MVC Grid DataSource Change Event

2 Answers 434 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Lee
Top achievements
Rank 1
Lee asked on 05 Oct 2017, 08:30 PM

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

2 Answers, 1 is accepted

Sort by
0
Lee
Top achievements
Rank 1
answered on 05 Oct 2017, 08:58 PM

 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.

 

0
Stefan
Telerik team
answered on 09 Oct 2017, 10:34 AM
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
Try our brand new, jQuery-free Angular 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
Lee
Top achievements
Rank 1
Answers by
Lee
Top achievements
Rank 1
Stefan
Telerik team
Share this question
or