Getting exception when trying to filter in radgrid after upgrading Telerik

[Kavya]

I upgraded Telerik from version 2013.1.220 to version 2020.3.1021. I am using .Net Framework 4.0.

After upgrading, the filter fails and throws following exception

Uncaught TypeError: Cannot read property 'getElementsByClassName' of null
    at Object.getElementByClassName (ScriptResource.axd?d=lJXgEP7wI3nlIkPPahFXpT5FyJRZNWmWFcbonPaNzQCr29d51fiQxZcKKz-XZVzVisx5XLZpVB-NztvzK3iRe1psnHhhTJI425cB8TVWgyl46g2BotFpZEOXuvA1&t=22bb6c4f:535)
    at Telerik.Web.UI.GridTableView.filter (ScriptResource.axd?d=kaODL2VRQAnyVu9y_F-sZ7AnJ-iRePgztIkR-jgmqCfB8tzNjqjoAgqOvRzhPCQkTOZ_yldfO9sTzLKCGG5S-TZNyrYIiWLuhLUovQ48NtZMgR6eER0lSZdv3BqM_8k7mggqLg2&t=22bb6c4f:5130)
    at ScriptResource.axd?d=kaODL2VRQAnyVu9y_F-sZ7AnJ-iRePgztIkR-jgmqCfB8tzNjqjoAgqOvRzhPCQkTOZ_yldfO9sTzLKCGG5S-TZNyrYIiWLuhLUovQ48NtZMgR6eER0lSZdv3BqM_8k7mggqLg2&t=22bb6c4f:3427

 

On debugging in chrome, I see that _getFilterCellByColumnUniqueName returns null because _getTableFilterRow returns null. This is causing the exception to be thrown.

 

 

My aspx code is given below :-

<telerik:RadAjaxPanel runat="server" LoadingPanelID="RadAjaxLoadingPanel1">
                        <telerik:RadGrid RenderMode="Lightweight" AutoGenerateColumns="false" ID="gvUsers" OnNeedDataSource="RadGrid1_NeedDataSource"
                            AllowFilteringByColumn="True" AllowSorting="True" Width="100%" EnableLinqExpressions="false"
                            ShowFooter="True" AllowPaging="True" runat="server">
                            <GroupingSettings CaseSensitive="false"></GroupingSettings>
                            <MasterTableView AutoGenerateColumns="false" AllowFilteringByColumn="True" ShowFooter="True">
                                <Columns>
                                    <telerik:GridBoundColumn FilterControlWidth="120px" DataField="email" HeaderText="email" AutoPostBackOnFilter="true">
                                    </telerik:GridBoundColumn>
                                </Columns>
                            </MasterTableView>
                        </telerik:RadGrid>
                    </telerik:RadAjaxPanel>

 

 

My cs code is given below :-

        protected void RadGrid1_NeedDataSource(object sender, Telerik.Web.UI.GridNeedDataSourceEventArgs e)
        {
            var users = Membership.GetAllUsers().Cast<MembershipUser>();
            if (ddlActiveFilter.SelectedValue.Equals("Active"))
            {
                (sender as RadGrid).DataSource = users.Where(u => !u.IsLockedOut && u.IsApproved);
            }
            else
            {
                (sender as RadGrid).DataSource = users.Where(u => u.IsLockedOut || !u.IsApproved);
            }
        }

 

Could someone please help me with this?

[Kavya]

I analyzed further and found this :-

As per https://docs.telerik.com/devtools/aspnet-ajax/controls/grid/appearance-and-styling/html-output - "When filteringis enabled, a filtering row (tr.rgFilterRow) appears below the header row. The filter row contains filtering controls (textboxes, date pickers, etc) and filtering buttons which are input.rgFilter elements (styled push buttons)."

Hence, rgFilterRow should be the class of the tr (table row) which has the filter controls, but it is not the case causing the feature to fail and exception being thrown because no filter row is returned in _getTableFilterRow function which checks whether row class has "rgFilterRow" present in it in the below line :-

if (c != null && c.cells[0] != null && c.cells[0].tagName != null && c.cells[0].tagName.toLowerCase() != "th" && c.className && c.className.indexOf("rgFilterRow") > -1)

[Doncho]

Hi Kavya,  

I have sent an answer to the formal support ticket you have opened for the same issue.

I would suggest proceeding with the communication there only. Once we reach a resolution I will post it here as well so it is visible to the community.

Kind regards,
Doncho
Progress Telerik