The Change event of the Grid not working in version 2022.3.1109

[Jose]

Hello,

The change event of the Grid not working in version 2022.3.1109

Not working when selectable set mode Single and type row.

.Selectable(selectable => selectable.Mode(GridSelectionMode.Single).Type(GridSelectionType.Row))

 

Thanks.

[Mihaela]

Hi Jose,

I have tested the Selectable() configuration, and it appears that the Change event triggers as expected at my end. I am attaching a runnable sample for your reference (.NET 6, ASP.NET Core MVC application, Telerik UI for ASP.NET Core version 2022.3.1109).

Would you please review the demo app and let me know if it is set up as per your Grid configuration?

Thank you for your cooperation.

Regards, Mihaela Progress Telerik

[Jose]

Hello,
    I have a navigation event. Which selects the row element for when you use the keys

    In this version, when I put this line in the navigate event, the onchange is no longer launched, in version 2022.1.301 and earlier this never gave problems.

Below is the modification of the example that you uploaded where the OnChange does not work

 @(Html.Kendo().Grid <SelectableGridTest.Models.OrderViewModel>()
            .Name("grid")
            .Columns(columns =>
            {
                columns.Bound(p => p.OrderID).Filterable(false);
                columns.Bound(p => p.Freight);
                columns.Bound(p => p.OrderDate).Format("{0:MM/dd/yyyy}");
                columns.Bound(p => p.ShipName);
                columns.Bound(p => p.ShipCity);
            })
            .Selectable(selectable => selectable.Mode(GridSelectionMode.Single).Type(GridSelectionType.Row))
            .Events(ev =>
            {
                ev.Change("onChange");
                ev.Navigate("onNavigate");
            })
            .Pageable()
            .Sortable()
            .Navigatable()
            .Scrollable()
            .Filterable()
            .HtmlAttributes(new { style = "height:550px;" })
            .DataSource(dataSource => dataSource
                .Ajax()
                .PageSize(20)
                .Read(read => read.Action("Orders_Read", "Grid"))
                )
        )

 

<script>
    function onChange(e) {
        console.log("on change");

    }

function onNavigate(e) {
        console.log("on navigate");
        var grid = e.sender;
        grid.select(grid.tbody.find(e.element.parent()));
    }
</script>                                

Regards,

Jose

 

 

          

[Jose]

If I have no other option, I think I could trigger the change after doing the select

function onNavigate(e) {
        console.log("on navigate");
        var grid = e.sender;
        grid.select(grid.tbody.find(e.element.parent()));
grid.trigger("change");
}

The issue is that this, in version 2022.1.301 did not need to be done because the change event kept working after the select.

Regards,

  Jose

[Mihaela]

Hi Jose,

Thank you for sharing the steps that replicates the behavior.

As of the 2022 R3 release, the Grid client-side API methods (i.e., select()) do not fire the Change event. For more information, check out the following sections in the documentation:

https://docs.telerik.com/aspnet-core/backwards-compatibility/2022-backwards-compatibility#telerik-ui-for-aspnet-core-r3-2022

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

If any questions arise, please let me know.

Best,

Mihaela