Column Unique Name unknown when using Custom Filter Options with Handling

[Phillip]

Following this example: https://docs.telerik.com/devtools/aspnet-ajax/controls/grid/how-to/Filtering/custom-filter-options-with-handling

Everything works in this example, except when the Menu Item is clicked and FilterCommandEvent is fired, there is no unique column name in the RadGrids Item Command.

e.Item.Attributes["columnUniqueName"] does not have unique name of column.

 

protected void filterMenu_ItemClick(object sender, RadMenuEventArgs e)
{
    GridFilteringItem filterItem = RadGrid1.MasterTableView.GetItems(GridItemType.FilteringItem)[0] as GridFilteringItem;
    filterItem.FireCommandEvent("Filter", new Pair(e.Item.Value, e.Item.Attributes["columnUniqueName"]));
}

 

Looking through the RadMenuItem object and GridFilteringItem object, I do not see any reference to the column that is trying to be filtered.

 

Is there a way to know the column that the filter option being selected is from? There would have to be, otherwise there would be no reason to allow customer filter Options if you never knew the column to filter on.

 

I am using 2021 Q1 Telerik.Web.UI

[Vessy]

Hi Phillip,

The filterMenu_ItemClick function is a handler to the RadMenu ItemClick event, thus the currently filtered column cannot be accessed directly in it:
https://docs.telerik.com/devtools/aspnet-ajax/controls/menu/server-side-programming/itemclick

A possible approach I can suggest you is to:

• attach a handler to the Grid's OnFilterMenuShowing event
  

          <telerik:RadGrid ID="RadGrid1" runat="server" AllowPaging="True" CellSpacing="0"
              GridLines="None" Width="800px" OnNeedDataSource="RadGrid1_NeedDataSource"
              AllowSorting="true" AllowFilteringByColumn="True">
              <ClientSettings>
                  <ClientEvents OnFilterMenuShowing="onFilterMenuShowing" />
                  ...

• assign the unique name of the currently filtered column as a value of a hidden field on the page:
  

          <asp:HiddenField ID="filteredColumnName" runat="server" />
          <script>
              function onFilterMenuShowing(sender, args) {
                  var colName = args.get_column().get_uniqueName();
                  $get("filteredColumnName").value = colName;
              }
          </script>

• Access this hidden field value in the filterMenu_ItemClick handler:
  

      protected void filterMenu_ItemClick(object sender, RadMenuEventArgs e)
      {
          GridFilteringItem filterItem = RadGrid1.MasterTableView.GetItems(GridItemType.FilteringItem)[0] as GridFilteringItem;
          string colUniqueName = filteredColumnName.Value;
  
          filterItem.FireCommandEvent("Filter", new Pair(e.Item.Value, e.Item.Attributes[colUniqueName]));
      }

 

Regards,
Vessy
Progress Telerik

[Phillip]

Thanks for the help. 

Just for others reference it should be:
Access this hidden field value in the filterMenu_ItemClick handler

protected void filterMenu_ItemClick(object sender, RadMenuEventArgs e)
    {
        GridFilteringItem filterItem = RadGrid1.MasterTableView.GetItems(GridItemType.FilteringItem)[0] as GridFilteringItem;
        string colUniqueName = filteredColumnName.Value;

        filterItem.FireCommandEvent("Filter", new Pair(e.Item.Value, colUniqueName));
    }

 

 

Also if someone comes to this post looking about doing multiple custom columns for a specific column or type of columns you can also hide specific filter menu items OnClientShowing, for specific Column Types or Column Names:

<telerik:RadGrid ID="RadGrid1" runat="server" AllowPaging="True" CellSpacing="0"
            GridLines="None" Width="800px" OnNeedDataSource="RadGrid1_NeedDataSource"
            AllowSorting="true" AllowFilteringByColumn="True">
            <FilterMenu OnClientShowing="MenuShowing" />
            <ClientSettings>
                <ClientEvents OnFilterMenuShowing="onFilterMenuShowing" />
                ...

 

<asp:HiddenField ID="filteredColumnName" runat="server" />
<script>
        var column = null;
        var colName = null;

        function MenuShowing(sender, args) {
            if (column == null) return;
            if (colName == null) return;
            var menu = sender; var items = menu.get_items();
            if (column.get_dataType() != "System.DateTime") {
                var j = 0;
                while (j < items.get_count()) {
                    if ((items.getItem(j).get_value() in
                        { 'ThisWeek': '', 'NextWeek': '', 'ThisMonth': '', 'NextMonth': '', 'ThisYear': '' })) {
                        var item = items.getItem(j);
                        if (item != null)
                            item.set_visible(false);
                    }
                    j++;
                }
            }
            column = null;
            colName = null;
        }
            function onFilterMenuShowing(sender, args) {
                column = eventArgs.get_column();
                colName = args.get_column().get_uniqueName();
                $get("filteredColumnName").value = colName;
            }
</script>

 

[Vessy]

Hi,

You are welcome, Phillip! Thank you for sharing your complete solution with the community!

Regards,
Vessy
Progress Telerik