This is a migrated thread and some comments may be shown as answers.

RadGrid With Custom Dropdown Filter Not Working Properly

9 Answers 628 Views

Grid

This is a migrated thread and some comments may be shown as answers.

Virgil Rodriguez asked on 20 Jul 2016, 05:58 PM

Hello Telerik,

I was able to implement the Filter with MS DropdownList Instead of Textbox solution posted in the Telerik Help Site.

However, I am stumped as to why the dropdown filter works on some entries but not on some. See image below:

Below is how I declared my RadGrid in my .ASPX page:

<telerik:RadGrid ID="rgOT_Classifications"

runat="server"

Skin="Default"

GridLines="both"

BorderStyle="NotSet"

BorderColor="#336699"

BorderWidth="3"

PageSize="3"

Width="100%"

AllowPaging="true"

AllowFilteringByColumn="true"

AutoGenerateColumns="false"

AllowSorting="true"

ShowStatusBar="true"

AllowAutomaticDeletes="false"

AllowAutomaticInserts="false"

ItemStyle-BackColor="#f0f8ff"

AlternatingItemStyle-BackColor="White"

AllowAutomaticUpdates="false">

<PagerStyle Mode="NextPrevAndNumeric" />

<MasterTableView Width="100%" DataKeyNames="CLASSIFICATION" TableLayout="Auto" Caption="<strong><big>CLASSIFICATIONS</big></strong>"

CommandItemDisplay="Top" EditMode="EditForms" ExpandCollapseColumn-ButtonType="pushButton" AllowMultiColumnSorting="true"

Name="Classifications" ShowHeadersWhenNoRecords="true">

<CommandItemTemplate>

<table width="98%" style="margin:10px auto;">

<tr>

<td align="left" style="vertical-align:middle;">

<asp:ImageButton ID="ImageButton1" runat="server" ImageUrl="~/images/add.png" CommandName="InitInsert" ImageAlign="Middle"/>

<asp:LinkButton id="btnAddNewRecord" runat="server" CommandName="InitInsert" Font-Size="10" style="vertical-align:middle;"

ToolTip="Click to add a new Classification.">Add New Record

</asp:LinkButton>

</td>

<td align="right">

<div title="Click to clear the current filter criteria." style="float:left;">

<asp:ImageButton ID="ImageButton2" runat="server" ImageUrl="~/images/clearfilter.gif" CommandName="ClearFilter" ImageAlign="Middle"/>

<asp:LinkButton id="btnClearFilter" Font-Size="10" style="vertical-align:middle;"

runat="server" CommandName="ClearFilter">Clear Filter

</asp:LinkButton>

</div>

<div title="Click to reload data into the grid." style="float:right;">

<asp:ImageButton ID="ImageButton3" runat="server" ImageUrl="~/images/Refresh.gif" CommandName="Refresh" ImageAlign="Middle"/>

<asp:LinkButton style="vertical-align:middle;" id="btnRefresh" Font-Size="10"

runat="server" CommandName="Refresh">Refresh

</asp:LinkButton>

</div>

</td>

</tr>

</table>

</CommandItemTemplate>

<Columns>

<telerik:GridEditCommandColumn UniqueName="Edit" ItemStyle-HorizontalAlign="center">

</telerik:GridEditCommandColumn>

<telerik:GridBoundColumn DataField="CLASSIFICATION" HeaderText="Classification" UniqueName="CLASSIFICATION"

AutoPostBackOnFilter="true" CurrentFilterFunction="Contains" ShowFilterIcon="false">

</telerik:GridBoundColumn>

<custom:MyCustomFilteringColumn HeaderText="CLASS 1" DataField="CLASSIFICATION" UniqueName="CLASS1" AutoPostBackOnFilter="false" DataType="System.String" CurrentFilterFunction="Contains" >

</custom:MyCustomFilteringColumn>

<telerik:GridButtonColumn ButtonType="LinkButton" CommandName="Delete" Text="Delete" UniqueName="DeleteColumn" ItemStyle-HorizontalAlign="center">

</telerik:GridButtonColumn>

</Columns>

<EditFormSettings UserControlName="~/maintenance/Edit_OT_Classifications.aspx"

EditFormType="WebUserControl"

PopUpSettings-Modal="true"

PopUpSettings-Width="35%"

>

</EditFormSettings>

</MasterTableView>

</telerik:RadGrid>

It's odd that there is no pattern as to why some dropdown entries work and some don't. If you could create it on your end and let me know if it worked for you or not and if you have a solution for this.

Thanks,

Virgil

9 Answers, 1 is accepted

answered on 25 Jul 2016, 09:53 AM

Hi Virgil,

The filter value should be applied for all items in the dropdown control. Would you check the browser console and see if there are any errors listed there?

As for your other query. When you use RadComboBox instead of a DropDownList you can still use the OnSelectedIndexChanged event to apply the filtering.

An alternative approach you can use to have a dropdown control as filter is to add a filter template for the grid. Check out the following example that illustrates the approach.

http://demos.telerik.com/aspnet-ajax/grid/examples/functionality/filtering/filter-templates/defaultcs.aspx

Regards,
Viktor Tachev
Telerik by Progress

Do you need help with upgrading your ASP.NET AJAX, WPF or WinForms projects? Check the Telerik API Analyzer and share your thoughts.

answered on 28 Jul 2016, 12:28 PM

CustomFilterColumn.zip

Hi Virgil,

I tested the behavior and it is working as expected on my end. I am attaching a sample WebSite project as reference. Give it a try and see how it works for you.

Let me know what needs to be changed in the sample so that the behavior you are seeing is replicated.

Regards,
Viktor Tachev
Telerik by Progress

Do you need help with upgrading your ASP.NET AJAX, WPF or WinForms projects? Check the Telerik API Analyzer and share your thoughts.

answered on 28 Jul 2016, 05:43 PM

Hi Viktor,

Okay I tried the sample project, but I had to do the following:

First convert the code from "C#" to "VB".
Got rid of anything that's related to SQL Server Express - because I don't have SQL Server Express.
Created my own static table reflecting the data and records of my initial post.

The conversion went well and I was able to build and execute the project without any errors.

However, I still had the same WEIRD, really WEIRD results. The filter worked for all records EXCEPT for the following entries:

THIS IS IT MAKE NO MISTAKE WHERE YOU ARE THIS IS I
TO BE OR NOT TO BE THAT IS THE QUESTION
WHAT IS HAPPENING?
JACK AND JILL WENT UP THE HILL TO FETCH A PAIL OF

Finally, I have changed DropDownList and instead used RadComboBox - with the same results! I feel I will become famous for discovering these 4 entries that JUST WON'T WORK.

Can you please implement the AllowCustomText() feature of the RadComboBox and make the filter work when TextChanged event work or SelectedIndexChanged events are triggered?

Many thanks in advance.

Virgil

Here is the _Default.ASPX:

<%@ Page Language="VB" AutoEventWireup="true" CodeFile="_Default.aspx.vb" Inherits="MyStuff.MyRadGrid" %>

<%@ Register Namespace="MyStuff" TagPrefix="custom" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

<title></title>

<style type="text/css">

</style>

</head>

<body>

<form id="form1" runat="server">

<telerik:RadScriptManager runat="server" ID="RadScriptManager1">

</telerik:RadScriptManager>

<telerik:RadScriptBlock runat="server" ID="RadCodeBlock1">

<script type="text/javascript">

</script>

</telerik:RadScriptBlock>

<telerik:RadGrid

ID="RadGrid1" runat="server"

AllowFilteringByColumn="True"

AllowPaging="True" PageSize="20"

OnItemCommand="RadGrid1_ItemCommand">

<MasterTableView

AutoGenerateColumns="False"

CommandItemDisplay="Top">

<CommandItemTemplate>

<asp:LinkButton runat="server" ID="LinkButton1"

Text="Clear Filters"

CommandName="ClearFilters" />

</CommandItemTemplate>

<Columns>

<telerik:GridBoundColumn

CurrentFilterFunction="Contains"

HeaderText="CLASSIFICATION"

DataField="CLASSIFICATION"

UniqueName="CLASSIFICATION" />

<custom:MyCustomFilteringColumn

HeaderText="CLASS1"

DataField="CLASS1"

UniqueName="CLASS1" />

</Columns>

</MasterTableView>

</telerik:RadGrid>

</form>

</body>

</html>

Here is the _Default.ASPX.VB:

Imports System.Collections.Generic

Imports System.Configuration

Imports System.Data

Imports System.Data.OleDb

Imports System.Data.SqlClient

Imports System.Globalization

Imports System.Linq

Imports System.Threading

Imports System.Web

Imports System.Web.UI

Imports System.Web.UI.WebControls

Imports Telerik.Web.UI

Namespace MyStuff

Partial Public Class MyRadGrid

Inherits System.Web.UI.Page

Private staticTable As DataTable

Protected Sub Page_Load(sender As Object, e As EventArgs)

staticTable = CreateStaticTable()

RadGrid1.DataSource = staticTable

For Each column As GridBoundColumn In RadGrid1.MasterTableView.Columns

If TypeOf column Is MyStuff.MyCustomFilteringColumn Then

TryCast(column, MyStuff.MyCustomFilteringColumn).ListDataSource = GetFilterStaticTable(column.DataField)

TryCast(column, MyStuff.MyCustomFilteringColumn).FilterWidth = Unit.Percentage(99)

End If

Next

End Sub

Function CreateStaticTable() As DataTable

Dim table As New DataTable

table.Columns.Add("CLASSIFICATION", GetType(String))

table.Columns.Add("CLASS1", GetType(String))

table.Rows.Add("111111 2222222222 33333333333 444444444444 555555", "111111 2222222222 33333333333 444444444444 555555")

table.Rows.Add("AAAAAA BBBBB CCCCCCCCC", "AAAAAA BBBBB CCCCCCCCC")

table.Rows.Add("HELLO PLANET NIBIRU", "HELLO PLANET NIBIRU")

table.Rows.Add("HUMPTY DUMPTY SAT ON THE WALL HUMPTY DUMPTY HAD A", "HUMPTY DUMPTY SAT ON THE WALL HUMPTY DUMPTY HAD A")

table.Rows.Add("KUMUSTA ANDROMEDA ?", "KUMUSTA ANDROMEDA ?")

table.Rows.Add("THE QUICK BROWN FOX JUMPED OVER THE LAZY DOG NEAR", "THE QUICK BROWN FOX JUMPED OVER THE LAZY DOG NEAR")

table.Rows.Add("__THIS IS IT MAKE NO MISTAKE WHERE YOU ARE THIS IS I", "THIS IS IT MAKE NO MISTAKE WHERE YOU ARE THIS IS I")

table.Rows.Add("__TO BE OR NOT TO BE THAT IS THE QUESTION", "TO BE OR NOT TO BE THAT IS THE QUESTION")

table.Rows.Add("__WHAT IS HAPPENING?", "WHAT IS HAPPENING?")

table.Rows.Add("WHAT THE FREAK?", "WHAT THE FREAK?")

table.Rows.Add("XXXXXXXXXXX YYYYYYYYYYYY ZZZZZZZZZZZZ", "XXXXXXXXXXX YYYYYYYYYYYY ZZZZZZZZZZZZ")

table.Rows.Add("YYYYYYYYYYYY ZZZZZZZZZZZZ XXXXXXXXXXXX", "YYYYYYYYYYYY ZZZZZZZZZZZZ XXXXXXXXXXXX")

table.Rows.Add("ZZZZZZZZZZ XXXXXXXXX YYYYYYYYY", "ZZZZZZZZZZ XXXXXXXXX YYYYYYYYY")

table.Rows.Add("__JACK AND JILL WENT UP THE HILL TO FETCH A PAIL OF", "JACK AND JILL WENT UP THE HILL TO FETCH A PAIL OF")

table.Rows.Add("HUMPTY DUMPTY SAT ON A WALL. HUMPTY DUMPTY HAD A", "HUMPTY DUMPTY SAT ON A WALL. HUMPTY DUMPTY HAD A")

Return table

End Function

Private Function GetFilterStaticTable(Field As String) As DataTable

Dim dtDistinct As DataTable = New DataTable

dtDistinct = staticTable.DefaultView.ToTable(True, Field)

Return dtDistinct

End Function

Protected Sub RadGrid1_ItemCommand(source As Object, e As GridCommandEventArgs)

If e.CommandName = "ClearFilters" Then

For Each column As GridColumn In RadGrid1.MasterTableView.Columns

column.CurrentFilterFunction = GridKnownFunction.NoFilter

column.CurrentFilterValue = [String].Empty

Next

RadGrid1.MasterTableView.FilterExpression = [String].Empty

RadGrid1.MasterTableView.Rebind()

End If

End Sub

End Class

End Namespace

Here is the MyCustomFilteringColumn.VB :

Imports System.Collections.Generic

Imports System.Linq

Imports System.Web

Imports System.Web.UI

Imports System.Web.UI.WebControls

Imports Telerik.Web.UI

Namespace MyStuff

Public Class MyCustomFilteringColumn : Inherits GridBoundColumn

Private m_listDataSource As Object = Nothing

Private _filterWidth As Unit = Nothing

'RadGrid calls this method when it initializes the controls inside the filtering item cells

Public Property FilterWidth As Unit

Get

Return _filterWidth

End Get

Set(ByVal value As Unit)

_filterWidth = value

End Set

End Property

Protected Overrides Sub SetupFilterControls(cell As TableCell)

MyBase.SetupFilterControls(cell)

cell.Controls.RemoveAt(0)

Dim list As New RadComboBox()

list.ID = "list" + Me.DataField

list.AutoPostBack = True

AddHandler list.SelectedIndexChanged, AddressOf list_SelectedIndexChanged

cell.Controls.AddAt(0, list)

cell.Controls.RemoveAt(1)

list.DataTextField = Me.DataField

list.DataValueField = Me.DataField

list.DataSource = Me.ListDataSource

list.Width = _filterWidth

End Sub

Private Sub list_SelectedIndexChanged(sender As Object, e As EventArgs)

Dim filterItem As GridFilteringItem = TryCast(TryCast(sender, RadComboBox).NamingContainer, GridFilteringItem)

If Me.DataType = System.Type.[GetType]("System.Int32") OrElse Me.DataType = System.Type.[GetType]("System.Int16") OrElse Me.DataType = System.Type.[GetType]("System.Int64") Then

filterItem.FireCommandEvent("Filter", New Pair("EqualTo", Me.UniqueName))

Else

' treat everything else like a string

filterItem.FireCommandEvent("Filter", New Pair("Contains", Me.UniqueName))

End If

End Sub

Public Property ListDataSource() As Object

Get

Return Me.m_listDataSource

End Get

Set

m_listDataSource = value

End Set

End Property

'RadGrid calls this method when the value should be set to the filtering input control(s)

Protected Overrides Sub SetCurrentFilterValueToControl(cell As TableCell)

MyBase.SetCurrentFilterValueToControl(cell)

Dim list As RadComboBox = DirectCast(cell.Controls(0), RadComboBox)

If Me.CurrentFilterValue <> String.Empty Then

list.SelectedValue = Me.CurrentFilterValue

End If

End Sub

'RadGrid calls this method to extract the filtering value from the filtering input control(s)

Protected Overrides Function GetCurrentFilterValueFromControl(cell As TableCell) As String

Dim list As RadComboBox = DirectCast(cell.Controls(0), RadComboBox)

Return list.SelectedValue

End Function

Protected Overrides Function GetFilterDataField() As String

Return Me.DataField

End Function

End Class

End Namespace

Here is the web.config:

<?xml version="1.0" encoding="UTF-8"?>

<!--

For more information on how to configure your ASP.NET application, please visit

http://go.microsoft.com/fwlink/?LinkId=169433

-->

<configuration>

<appSettings>

<add key="webpages:Enabled" value="true" />

</appSettings>

<connectionStrings>

</connectionStrings>

<!--

For a description of web.config changes for .NET 4.5 see http://go.microsoft.com/fwlink/?LinkId=235367.

The following attributes can be set on the <httpRuntime> tag.

<system.Web>

<httpRuntime targetFramework="4.5" />

</system.Web>

-->

<system.web>

<customErrors mode="Off" />

<compilation debug="true" targetFramework="4.5">

<assemblies>

</assemblies>

</compilation>

<httpRuntime maxRequestLength="2097151" requestValidationMode="2.0" />

<pages validateRequest="false" controlRenderingCompatibilityVersion="4.0">

<controls>

<add tagPrefix="telerik" assembly="Telerik.Web.UI" namespace="Telerik.Web.UI" />

</controls>

</pages>

<httpHandlers>

<add path="Telerik.Web.UI.WebResource.axd" type="Telerik.Web.UI.WebResource" verb="*" validate="false" />

</httpHandlers>

</system.web>

<system.webServer>

<validation validateIntegratedModeConfiguration="false" />

<handlers>

<add name="Telerik_Web_UI_WebResource_axd" verb="*" preCondition="integratedMode" path="Telerik.Web.UI.WebResource.axd" type="Telerik.Web.UI.WebResource" />

</handlers>

</system.webServer>

</configuration>

Accepted

answered on 02 Aug 2016, 10:42 AM

Hi Virgil,

Thank you for the runnable sample. I ran it and was able to run it and find the cause of the behavior.

By default the RadGrid has set of predefined strings that are marked as "illegal" for filtering. These strings include keywords that can be used with malicious intentions. This is why the filter expression will exclude them by default and the filter will not be applied.

All four of the values that are not working with filtering have one thing in common. They all have contain such "illegal strings". You can see them highlighted below:

THIS IS IT MAKE NO MISTAKE WHERE YOU ARE THIS IS I
TO BE OR NOT TO BE THAT IS THE QUESTION
WHAT IS HAPPENING?
JACK AND JILL WENT UP THE HILL TO FETCH A PAIL OF

In order to change the behavior you can modify the default IllegalStrings property. Check out the code snippet below that outlines the approach:

Protected Sub Page_Load(sender As Object, e As EventArgs) Handles Me.Load

GridFilterFunction.IllegalStrings = New String() {" LIKE ", ">", "<", "<>", " NULL "}

For Each column As GridBoundColumn In RadGrid1.MasterTableView.Columns

If TypeOf column Is MyStuff.MyCustomFilteringColumn Then

TryCast(column, MyStuff.MyCustomFilteringColumn).ListDataSource = GetFilterStaticTable(column.DataField)

End If

Next

End Sub

Regards,
Viktor Tachev
Telerik by Progress

Do you need help with upgrading your ASP.NET AJAX, WPF or WinForms projects? Check the Telerik API Analyzer and share your thoughts.