Filtering in rad grid.

[yogesh]

hi telerik team,

i am unable to do filtering in rad grid.Can you please tell me what i am doing wrong.

<telerik:RadGrid runat="server" ID="filteringRadGrid" OnNeedDataSource="filteringRadGrid_NeedDataSource"
AutoGenerateColumns="false">
<MasterTableView EditMode="InPlace" AllowFilteringByColumn="true">
<Columns>
<telerik:GridTemplateColumn HeaderText="Date" UniqueName="ShippedDate">
<ItemTemplate>
<asp:Label ID="dateLabel" runat="server" Text='<%#Eval("date")%>'></asp:Label>
</ItemTemplate>
<FilterTemplate>
  <telerik:RadDatePicker ID="filterRadDatePicker" runat="server" Width="100px" ClientEvents-OnDateSelected="DateSelected" />
<telerik:RadScriptBlock ID="RadScriptBlock2" runat="server">

<script type="text/javascript">
function DateSelected(sender, args) {
var tableView = $find("<%# ((GridItem)Container).OwnerTableView.ClientID %>");

var date = FormatSelectedDate(sender);
//alert(date);
tableView.filter("date", date, "EqualTo");
}
function FormatSelectedDate(picker) {
var date = picker.get_selectedDate();
var dateInput = picker.get_dateInput();
var formattedDate = dateInput.get_dateFormatInfo().FormatDate(date, dateInput.get_displayDateFormat());

return formattedDate;
}
</script>

</telerik:RadScriptBlock>
</FilterTemplate>
</telerik:GridTemplateColumn>
<telerik:GridTemplateColumn HeaderText="Date Time">
<ItemTemplate>
<asp:Label ID="dateTimeLabel" runat="server" Text='<%#Eval("dateTime") %>'></asp:Label>
</ItemTemplate>
</telerik:GridTemplateColumn>
<telerik:GridTemplateColumn HeaderText="Compliance Status">
<ItemTemplate>
<telerik:RadComboBox ID="compStatusRadComboBox" runat="server">
<Items>
<telerik:RadComboBoxItem Value="0" Text="ao" />
<telerik:RadComboBoxItem Value="1" Text="bo" />
<telerik:RadComboBoxItem Value="2" Text="co" />
</Items>
</telerik:RadComboBox>
</ItemTemplate>
</telerik:GridTemplateColumn>
</Columns>
</MasterTableView>
</telerik:RadGrid>

protected void filteringRadGrid_NeedDataSource(object sender, Telerik.Web.UI.GridNeedDataSourceEventArgs e)
{
DataTable dt = new DataTable();
dt.Columns.Add("date");
dt.Columns.Add("dateTime");
dt.Columns.Add("cs");
dt.Rows.Add("1/12/2001", "1/12/2001 00:00:03 AM", "ao");
dt.Rows.Add("1/12/2002", "1/12/2002 00:00:06 AM", "co");
dt.Rows.Add("1/12/2003", "1/12/2003 00:00:09 AM", "bo");
filteringRadGrid.DataSource = dt;

}

[Pavlina]

Hello,

To allow filtering in template columns, you need to set the DataField property of the template column to the field you want to use for filtering. You can review the help article below for more information:
http://www.telerik.com/help/aspnet-ajax/grdimplementingfilteringfortemplatecolumns.html

Kind regards,
Pavlina
the Telerik team

[yogesh]

hi palvina,

i have set the datafield property but still nothing happens.

Please note that my custom filter is in the first field (date column). what i need is that when i select the date in the custom filter my grid should refresh and bring on only those date which are equal to the dates set in the custom date filter.

Need the help urgently.......

<telerik:RadGrid runat="server" ID="filteringRadGrid" OnNeedDataSource="filteringRadGrid_NeedDataSource"
AutoGenerateColumns="false">
<MasterTableView EditMode="InPlace" AllowFilteringByColumn="true">
<Columns>
<telerik:GridTemplateColumn HeaderText="Date" UniqueName="ShippedDate" DataField="date">
<ItemTemplate>
<asp:Label ID="dateLabel" runat="server" Text='<%#Eval("date")%>'></asp:Label>
</ItemTemplate>
<FilterTemplate>
<telerik:RadDatePicker ID="filterRadDatePicker" runat="server" Width="100px" ClientEvents-OnDateSelected="DateSelected"/>
<telerik:RadScriptBlock ID="RadScriptBlock2" runat="server">

<script type="text/javascript">
function DateSelected(sender, args) {
var tableView = $find("<%# ((GridItem)Container).OwnerTableView.ClientID %>");

var date = FormatSelectedDate(sender);
//alert(date);
tableView.filter("date", date, "EqualTo");
}
function FormatSelectedDate(picker) {
var date = picker.get_selectedDate();
var dateInput = picker.get_dateInput();
var formattedDate = dateInput.get_dateFormatInfo().FormatDate(date, dateInput.get_displayDateFormat());

return formattedDate;
}
</script>

</telerik:RadScriptBlock>
</FilterTemplate>
</telerik:GridTemplateColumn>
<telerik:GridTemplateColumn HeaderText="Date Time">
<ItemTemplate>
<asp:Label ID="dateTimeLabel" runat="server" Text='<%#Eval("dateTime") %>'></asp:Label>
</ItemTemplate>
</telerik:GridTemplateColumn>
<telerik:GridTemplateColumn HeaderText="Compliance Status">
<ItemTemplate>
<telerik:RadComboBox ID="compStatusRadComboBox" runat="server">
<Items>
<telerik:RadComboBoxItem Value="0" Text="ao" />
<telerik:RadComboBoxItem Value="1" Text="bo" />
<telerik:RadComboBoxItem Value="2" Text="co" />
</Items>
</telerik:RadComboBox>
</ItemTemplate>
</telerik:GridTemplateColumn>
</Columns>
</MasterTableView>
</telerik:RadGrid>

protected void filteringRadGrid_NeedDataSource(object sender, Telerik.Web.UI.GridNeedDataSourceEventArgs e)
{
DataTable dt = new DataTable();
dt.Columns.Add("date");
dt.Columns.Add("dateTime");
dt.Columns.Add("cs");
dt.Rows.Add("1/12/2001", "1/12/2001 00:00:03 AM", "ao");
dt.Rows.Add("1/12/2002", "1/12/2002 00:00:06 AM", "co");
dt.Rows.Add("1/12/2003", "1/12/2003 00:00:09 AM", "bo");
filteringRadGrid.DataSource = dt;

}

[Pavlina]

Hello,

Please refer to the second grid in the online example below, which demonstrates how you can filter date column:
http://demos.telerik.com/aspnet-ajax/grid/examples/programming/filtertemplate/defaultcs.aspx

Give it a try and let me know how it goes.

Best wishes,
Pavlina
the Telerik team

[yogesh]

hi pavlina ,

 its of no user plese see my code and tell me what 's is wrong.

Thank.s

[yogesh]

hi team telerik,

please give me some solution so that i can fix the issue.

thanks.

[Jayesh Goyani]

hi Yogesh

  <telerik:GridTemplateColumn HeaderText="Date" UniqueName="ShippedDate" DataField="date">
                        <ItemTemplate>
                            <asp:Label ID="dateLabel" runat="server" Text='<%#Eval("date")%>'></asp:Label>
                        </ItemTemplate>
                        <FilterTemplate>
                            <telerik:RadDatePicker ID="filterRadDatePicker" runat="server" Width="100px" ClientEvents-OnDateSelected="DateSelected" />
                            <telerik:RadScriptBlock ID="RadScriptBlock2" runat="server">
                               <script type="text/javascript">
                                   function DateSelected(sender, args) {
                                       var tableView = $find("<%# ((GridItem)Container).OwnerTableView.ClientID %>");
 
                                       var date = FormatSelectedDate(sender);

                                       tableView.filter("ShippedDate", date, "EqualTo");
                                   }
                                   function FormatSelectedDate(picker) {
                                       var date = picker.get_selectedDate();
                                       var dateInput = picker.get_dateInput();
                                       var formattedDate = dateInput.get_dateFormatInfo().FormatDate(date, dateInput.get_displayDateFormat());
 
                                       return formattedDate;
                                   }
</script>
                            </telerik:RadScriptBlock>
                        </FilterTemplate>
                    </telerik:GridTemplateColumn>

..................................
issue is in this line  tableView.filter("ShippedDate", date, "EqualTo"); .
u write here datafield name inplace of column unique name.



Thanks,
Jayesh Goyani

[yogesh]

hi jayesh,

nothing has helped...

i have already written

tableView.filter("date", date, "EqualTo");

here the first parameter date is my datafield.

The grid does not post back on setting the   date  in the filter column .

Please help .

Thanks.

[Jayesh Goyani]

Hi yogesh,

the correct code is shown below.

<telerik:GridTemplateColumn HeaderText="Date" UniqueName="ShippedDate" DataField="date">
                        <ItemTemplate>
                            <asp:Label ID="dateLabel" runat="server" Text='<%#Eval("date")%>'></asp:Label>
                        </ItemTemplate>
                        <FilterTemplate>
                            <telerik:RadDatePicker ID="filterRadDatePicker" runat="server" Width="100px" ClientEvents-OnDateSelected="DateSelected" />
                            <telerik:RadScriptBlock ID="RadScriptBlock2" runat="server">
                               <script type="text/javascript">
                                   function DateSelected(sender, args) {
                                       var tableView = $find("<%# ((GridItem)Container).OwnerTableView.ClientID %>");
 
                                       var date = FormatSelectedDate(sender);

                                       tableView.filter("ShippedDate", date, "EqualTo");
                                   }
                                   function FormatSelectedDate(picker) {
                                       var date = picker.get_selectedDate();
                                       var dateInput = picker.get_dateInput();
                                       var formattedDate = dateInput.get_dateFormatInfo().FormatDate(date, dateInput.get_displayDateFormat());
 
                                       return formattedDate;
                                   }
</script>
                            </telerik:RadScriptBlock>
                        </FilterTemplate>
                    </telerik:GridTemplateColumn>

Thanks,
Jayesh Goyani