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

Cannot clear filters by javascript...

2 Answers 146 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Brian
Top achievements
Rank 1
Brian asked on 25 Feb 2011, 04:26 PM
Heyas;

I have a grid that I am trying to put a combo box in as a filter for a specific column.  I manually created the items in the combo box, then created a RadCodeBlock with a javascript function inside that is supposed to apply the appropriate filter, OR remove all the filters on that column.  So far, when I select a filter that is supposed to be "EqualTo", it works, but when I try to remove the filters entirely, I get a "No records to display" message.  This is clearly not the case, and I am not sure what else to try.   I've perused the forums and tried the solutions there, as well as the tried the API reference.  In fact, I copy/pasted the code directly, substituting where necessary, but it still does not work.  I am hoping someone can help me out here.  Here's the relevant aspx code:

<telerik:RadGrid ID="gridAllSurveys"
    runat="server"
    AllowFilteringByColumn="True"
    AutoGenerateColumns="False"
    DataSourceID="dsAllSurveys"
    GridLines="None"
    AllowPaging="True"
    AllowSorting="True"
    PageSize="20">
    <mastertableview
        datakeynames="SessionID"
        datasourceid="dsAllSurveys">
        <commanditemsettings exporttopdftext="Export to Pdf" />
        <rowindicatorcolumn>
            <HeaderStyle Width="20px" />
        </rowindicatorcolumn>
        <expandcollapsecolumn>
            <HeaderStyle Width="20px" />
        </expandcollapsecolumn>
        <Columns>
            <telerik:GridBoundColumn
                DataField="SessionID"
                DataType="System.Int32"
                HeaderText="SessionID"
                ReadOnly="True"
                Visible="false"
                SortExpression="SessionID"
                UniqueName="SessionID">
            </telerik:GridBoundColumn>
            <telerik:GridBoundColumn
                DataField="GuestEmail"
                HeaderStyle-HorizontalAlign="Center"
                ItemStyle-Width="150"
                FilterControlWidth="150"
                HeaderText="GuestEmail"
                SortExpression="GuestEmail"
                UniqueName="GuestEmail" />
            <telerik:GridDateTimeColumn
                DataField="SubmitDate"
                HeaderStyle-HorizontalAlign="Center"
                ItemStyle-HorizontalAlign="Center"
                ItemStyle-Width="120"
                FilterControlWidth="120"
                HeaderText="Submit Date"
                SortExpression="SubmitDate"
                UniqueName="SubmitDate" />
            <telerik:GridDateTimeColumn
                DataField="DateOfFirstEmail"
                HeaderStyle-HorizontalAlign="Center"
                ItemStyle-HorizontalAlign="Center"
                ItemStyle-Width="120"
                FilterControlWidth="120"
                HeaderText="1st Email"
                SortExpression="DateOfFirstEmail"
                UniqueName="DateOfFirstEmail" />
            <telerik:GridDateTimeColumn
                DataField="DateOfSecondEmail"
                HeaderStyle-HorizontalAlign="Center"
                ItemStyle-HorizontalAlign="Center"
                ItemStyle-Width="120"
                FilterControlWidth="120"
                HeaderText="2nd Email"
                SortExpression="DateOfSecondEmail"
                UniqueName="DateOfSecondEmail" />
            <telerik:GridDateTimeColumn
                DataField="DateOfThirdEmail"
                HeaderStyle-HorizontalAlign="Center"
                ItemStyle-HorizontalAlign="Center"
                ItemStyle-Width="120"
                FilterControlWidth="120"
                HeaderText="3rd Email"
                SortExpression="DateOfThirdEmail"
                UniqueName="DateOfThirdEmail" />
            <telerik:GridBoundColumn
                DataField="Status"
                HeaderStyle-HorizontalAlign="Center"
                ItemStyle-HorizontalAlign="Center"
                ItemStyle-Width="75"
                FilterControlWidth="75"
                HeaderText="Status"
                SortExpression="Status"
                UniqueName="Status" />
            <telerik:GridBoundColumn
                DataField="Quality"
                HeaderStyle-HorizontalAlign="Center"
                ItemStyle-HorizontalAlign="Center"
                ItemStyle-Width="90"
                FilterControlWidth="90"
                HeaderText="Survey Type"
                SortExpression="Quality"
                UniqueName="Quality" >
                <FilterTemplate>
                    <telerik:RadComboBox ID="RadComboBox1"
                        runat="server"
                        Width="90"
                        OnClientSelectedIndexChanged="SelectedIndexChanged">
                        <Items>
                            <telerik:RadComboBoxItem
                                Selected="True"
                                Text="Choose filter"
                                Value="" />
                            <telerik:RadComboBoxItem
                                Text="NoFilter"
                                Value="NoFilter" />
                            <telerik:RadComboBoxItem 
                                Text="positive"
                                Value="positive" />
                            <telerik:RadComboBoxItem 
                                Text="negative"
                                Value="negative" />
                        </Items>
                    </telerik:RadComboBox>
                    <telerik:RadScriptBlock ID="RadScriptBlock1" runat="server">
                    <script type="text/javascript">
                        function SelectedIndexChanged(sender, args)
                        {
                            var tableView = $find("<%=gridAllSurveys.ClientID %>").get_masterTableView();
                             
                            if (tableView.filter("Quality", args.get_item().get_value()) == "NoFilter")
                            {
                                tableView.filter("Quality", "", Telerik.Web.UI.GridFilterFunction.NoFilter);
                            }
                            else {
                                tableView.filter("Quality", args.get_item().get_value(), "EqualTo");
                            }
                        }
                    </script>
                    </telerik:RadScriptBlock>
                </FilterTemplate>
            </telerik:GridBoundColumn>
            <telerik:GridButtonColumn
                ButtonType="LinkButton"
                CommandName="Select"
                HeaderStyle-HorizontalAlign="Center"
                ItemStyle-HorizontalAlign="Center"
                ItemStyle-Width="25"
                FilterControlWidth="25"
                Text="Detail"
                UniqueName="btnViewDetail" />
        </Columns>
    </mastertableview>
</telerik:RadGrid>

Any help would be appreciated.  The examples given in the documentation only provide examples using linq.  While I realize this may be the preferred method, what I am doing is upgrading an existing 2.x application.  Adding linq to it would be problematic.

2 Answers, 1 is accepted

Sort by
0
Brian
Top achievements
Rank 1
answered on 28 Feb 2011, 07:36 PM
After some experimentation, I've refined the javascript to this;

<telerik:RadScriptBlock ID="RadScriptBlock1" runat="server">
<script type="text/javascript">
    function SelectedIndexChanged(sender, args)
    {
        var tableView = $find("<%# TryCast(Container,GridItem).OwnerTableView.ClientID%>");
        tableView.filter("Quality", args.get_item().get_value(), "EqualTo");
    }
</script>
</telerik:RadScriptBlock>

In this state, I can select "positive" and "negative" and have it successfully filter. However, when I try to put the "if" statement in, it will not work.  I can still filter by "positive" and "negative", but I lose my loading screen, and when I try to remove the filters, I end up with no records.  I have also tried rebind() and databind(), but both end up with the same result.  Here's the code with the "if" statement in it;

<telerik:RadScriptBlock ID="RadScriptBlock1" runat="server">
<script type="text/javascript">
    function SelectedIndexChanged(sender, args)
    {
        var tableView = $find("<%# TryCast(Container,GridItem).OwnerTableView.ClientID%>");
        if (tableView.filter("Quality", args.get_item().get_value()) == "NoFilter")
            tableView.filter("Quality", args.get_item().get_value(), "NoFilter");
        else
            tableView.filter("Quality", args.get_item().get_value(), "EqualTo");
    }
</script>
</telerik:RadScriptBlock>
0
Tsvetina
Telerik team
answered on 02 Mar 2011, 02:26 PM
Hi Brian,

Have you tried passing an empty string as a second argument in the case when you use the NoFilter function?
tableView.filter("Quality","", Telerik.Web.UI.GridFilterFunction.NoFilter);


Kind regards,
Tsvetina
the Telerik team
Registration for Q1 2011 What’s New Webinar Week is now open. Mark your calendar for the week starting March 21st and book your seat for a walk through all the exciting stuff we ship with the new release!
Tags
Grid
Asked by
Brian
Top achievements
Rank 1
Answers by
Brian
Top achievements
Rank 1
Tsvetina
Telerik team
Share this question
or