Setting a filter in the index changed event of a drop down combo not filtering the grid...

[Donovan]

Hi,

I have a grid declared as follows:

    <telerik:RadGrid ID="grdTimeSheets" runat="server">
        <MasterTableView>
            <Columns>
                <telerik:GridButtonColumn ButtonType="PushButton" CommandName="Update" FilterControlAltText="Filter colButtonUpdate column" Text="Update" UniqueName="grdTimeSheetscolEditRecordButton" />
                <telerik:GridButtonColumn ButtonType="PushButton" CommandName="Delete" FilterControlAltText="Filter colButtonDelete column" Text="Delete" UniqueName="grdTimeSheetscolDeleteRecordButton" />
                <telerik:GridBoundColumn DataField="UserName" FilterControlAltText="Filter By User Name" UniqueName="colUserName" HeaderText="User Name" CurrentFilterFunction="Contains">
                    <ItemStyle HorizontalAlign="Left" />
                </telerik:GridBoundColumn>
                <telerik:GridDateTimeColumn HeaderText="Clocked In" CurrentFilterFunction="GreaterThanOrEqualTo" DataField="ClockedInAt" DataType="System.DateTime" EditDataFormatString="dd-MMM-yyyy HH:mm" FilterControlAltText="Filter column column" FilterDateFormat="dd-MMM-yyyy HH:mm" PickerType="DateTimePicker" DataFormatString="{0:dd-MMM-yyyy HH:mm}" UniqueName="colClockInAt">
                </telerik:GridDateTimeColumn>
                <telerik:GridDateTimeColumn HeaderText="Clocked Out" CurrentFilterFunction="LessThanOrEqualTo" DataField="ClockedOutAt" DataType="System.DateTime" EditDataFormatString="dd-MMM-yyyy HH:mm" FilterControlAltText="Filter column1 column" FilterDateFormat="dd-MMM-yyyy HH:mm" PickerType="DateTimePicker" DataFormatString="{0:dd-MMM-yyyy HH:mm}" UniqueName="colClockOutAt">
                </telerik:GridDateTimeColumn>
            </Columns>
        </MasterTableView>
    </telerik:RadGrid>
</div>
<telerik:RadAjaxLoadingPanel ID="radLoadingPanel" runat="server" Skin="Metro"></telerik:RadAjaxLoadingPanel>
<telerik:RadAjaxManager ID="radAjaxManager" runat="server" DefaultLoadingPanelID="radLoadingPanel">
    <AjaxSettings>
        <telerik:AjaxSetting AjaxControlID="grdTimeSheets">
            <UpdatedControls>
                <telerik:AjaxUpdatedControl ControlID="grdTimeSheets" UpdatePanelCssClass="" />
            </UpdatedControls>
        </telerik:AjaxSetting>
    </AjaxSettings>
</telerik:RadAjaxManager>

with a combo box as follows:

<asp:DropDownList ID="ddlPayWeeks" runat="server" style="width: 200px;" OnSelectedIndexChanged="ddlPayWeeks_SelectedIndexChanged" AutoPostBack="True"></asp:DropDownList>

and in the code behind:

protected void ddlPayWeeks_SelectedIndexChanged(object sender, EventArgs e)
{
    if (ddlPayWeeks.SelectedIndex == 0)
        return;

    string selectedValue = ddlPayWeeks.SelectedValue;
    string startDate = selectedValue.Before("_");
    string finishDate = selectedValue.After("_");

    DateTime filterStartDate = DateTime.Parse(startDate);
    DateTime filterFinishDate = DateTime.Parse(finishDate);

    grdTimeSheets.MasterTableView.GetColumn("colClockInAt").CurrentFilterValue = string.Format("{0:dd-MMM-yyyy HH:mm}", filterStartDate);
    grdTimeSheets.MasterTableView.GetColumn("colClockInAt").CurrentFilterFunction = GridKnownFunction.GreaterThanOrEqualTo;
    grdTimeSheets.MasterTableView.GetColumn("colClockOutAt").CurrentFilterValue = string.Format("{0:dd-MMM-yyyy HH:mm}", filterFinishDate);
    grdTimeSheets.MasterTableView.GetColumn("colClockOutAt").CurrentFilterFunction = GridKnownFunction.LessThanOrEqualTo;
    grdTimeSheets.MasterTableView.Rebind();
}

 

So after the ddlPayWeeks_SelectedIndexChanged has fired I see the records as displayed in ss1.png - Note how the filter text has been filled in but the filter is not applied. If I then open the filter I see that the correct filter function is selected (ss2.png) but it is only when I click on the already selected GreaterThanOrEqualTo that I see the filter applied as per ss3.png.

 So I am guessing I need to do something additional in ddlPayWeeks_SelectedIndexChanged to cause the filter to occur?

[Donovan]

Forgot to add that I am assigning the NeedDataSource event of the grid in Page_Init - that is why it is not in the ASPX.

[Eyup]

Hi Donovan,

Generally, this requirement can be achieved using the filter() method on client-side:
http://www.telerik.com/help/aspnet-ajax/grid-gridtableview-filter.html

You can check the following live sample for an actual implementation:
http://demos.telerik.com/aspnet-ajax/grid/examples/functionality/filtering/filter-templates/defaultcs.aspx

Alternatively, in this scenario you can use the this syntax:

        GridFilteringItem filterItem = RadGrid1.MasterTableView.GetItems(
             GridItemType.FilteringItem)[0] as GridFilteringItem;

        RadDatePicker fromPicker = filterItem["OrderDate"].Controls[1] as RadDatePicker;
        fromPicker.SelectedDate = new DateTime(1997, 4, 2);

        RadDatePicker toPicker = filterItem["OrderDate"].Controls[4] as RadDatePicker;
        toPicker.SelectedDate = new DateTime(1997, 6, 17);

        filterItem.FireCommandEvent("Filter", new Pair("Between", "OrderDate"));
    }
}

Hope this helps. Please give it a try and let me know if it works for you.

Regards,
Eyup
Telerik