Change Value of DropdownList in Grid1 should change value in DropdownList of Grid2

[Nagarjuna]

I have tow KendoUI grids with one row and multiple columns.

If we change value of Column1 dropdown in Grid1, it should change value of Column1 Dropdown in Grid2,

Please share your inputs how we can implement this requirement in Jquery.

I have implemented both grids dropdown lists using Column Template.

Please find attachment for grid structures.

[Neli]

Hello Nagarjuna,

As you mentioned that the DropDownList is initialized in a column.template I guess you have followed the approach described in the Knowledge Base article linked below:

- https://docs.telerik.com/kendo-ui/knowledge-base/grid-dropdownlist-column-te

You could use the same approach in the change event handler of the DropDownList in the first Grid. You could find the needed row in the second Grid, get its dataItem, and set the new value. 

function onDDLChange(e) {

        var element = e.sender.element;
        var row = element.closest("tr");
        var grid = $("#grid").data("kendoGrid");
        var dataItem = grid.dataItem(row);
        dataItem.set("value", e.sender.value());

        var grid2 = $("#grid2").data("kendoGrid");
        var row2 = $('#grid2 tr:eq(1)')
        var dataItem2 = grid2.dataItem(row2);
        dataItem2.set("value", e.sender.value());        
};

Here is a Dojo example that demonstrated the approach.

Regards,
Neli
Progress Telerik