filter button context menu keyboard support

2 posts, 0 answers
  1. Sheng
    Sheng avatar
    11 posts
    Member since:
    Jul 2019

    Posted 27 May 2020 Link to this post

    My RadGird allows filtering by column.

    In IE 11, using keyboard only cannot move focus into filter button’s context menu.

    In Chrome, using keyboard can move the focus into context menu, but it seems there's no way to cancel the operation (close the context menu without applying any filter).

    Is there any way to enable good keyboard support for filter button's context menu?

  2. Attila Antal
    Attila Antal avatar
    590 posts

    Posted 01 Jun 2020 Link to this post

    Hi Sheng,

    When the AutoPostBackOnFilter property of the columns is enabled, it is expected that the Grid will do a PostBack and it will happen as soon as the change event fires for the FilterTextBox. See AutoPostBackOnFilter - Filtering.

    One option would be to disable the AutoPostBackOnFilter property, and then the filtering Meny will appear rather than applying the filter based on the current TextBox value and the FilterExpression defined for the column.

    Another option would be to access the Filter Controls on the server-side (or even client-side) and detach the "change" event.

    For example:

    protected void RadGrid1_PreRender(object sender, EventArgs e)
        foreach (GridFilteringItem filteringItem in RadGrid1.MasterTableView.GetItems(GridItemType.FilteringItem))
            foreach (GridColumn column in RadGrid1.MasterTableView.RenderColumns.Where(x => x.AutoPostBackOnFilter))
                var filterControl = filteringItem[column.UniqueName].Controls[0] as Control;
                if (filterControl == null) return;
                if (filterControl is TextBox)
                    // For ASP TextBox remove the onchange attribute
                    ((TextBox)filterControl).Attributes["onchange"] = "javascript:void(0)";
                else if (filterControl is RadTextBox)
                    // For RadTextBox, clear the OnValueChanged event handler
                    ((RadTextBox)filterControl).ClientEvents.OnValueChanged = "function(){}";
                else if (filterControl is RadNumericTextBox)
                    // For RadNumericTextBox, clear the OnValueChanged event handler
                    ((RadNumericTextBox)filterControl).ClientEvents.OnValueChanged = "function(){}";
                else if (filterControl is RadDateTimePicker)
                    // For RadDateTimePicker, clear the OnValueChanged event handler
                    ((RadDateTimePicker)filterControl).DateInput.ClientEvents.OnValueChanged = "function(){}";
                else if (filterControl is RadDatePicker)
                    // For RadDatePicker, clear the OnValueChanged event handler
                    ((RadDatePicker)filterControl).DateInput.ClientEvents.OnValueChanged = "function(){}";


    Kind regards,
    Attila Antal
    Progress Telerik

    Progress is here for your business, like always. Read more about the measures we are taking to ensure business continuity and help fight the COVID-19 pandemic.
    Our thoughts here at Progress are with those affected by the outbreak.
Back to Top