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

RadGrid Filter with Template column

0 Answers 149 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Rajeesh
Top achievements
Rank 1
Rajeesh asked on 26 Jun 2017, 02:07 PM

Hello Team,

I created a Rad grid with a GridBoundColumn which is assigned a DateTime column. I have the allowFilterOnColumns= True.

Since it is a template column i have added a RadDatePicker as said in the demo of basic template filtering.

But the filter is not working.

Here is the code i have now.

<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="GridwithFilter.aspx.vb" Inherits="WebApplication1.GridwithFilter" %>
 
<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
 
<!DOCTYPE html>
 
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
        <div>
            <telerik:RadScriptManager ID="rdsm1" runat="server"></telerik:RadScriptManager>
            <telerik:RadGrid ID="rgdFilter" runat="server" AutoGenerateColumns="false" AllowFilteringByColumn="true">
                <MasterTableView>
                    <Columns>
                        <telerik:GridTemplateColumn HeaderText="Product Name" UniqueName="ProductNameColumn">
                            <ItemTemplate>
                                <asp:Label ID="lblProduct" runat="server" Text='<%# Eval("ProductName") %>'></asp:Label>
                            </ItemTemplate>
                        </telerik:GridTemplateColumn>
                        <telerik:GridDateTimeColumn DataField="OrderDate" HeaderText="OrderDate" FilterControlWidth="110px"
                            SortExpression="OrderDate" PickerType="DatePicker" EnableTimeIndependentFiltering="true"
                            DataFormatString="{0:MM/dd/yyyy}">
                        </telerik:GridDateTimeColumn>
                         
                        <telerik:GridBoundColumn UniqueName="ShippedDate" DataField="ShippedDate" HeaderText="Shipped date"
                        DataFormatString="{0:d}" HeaderStyle-Width="100px">
                        <FilterTemplate>
                            <telerik:RadDatePicker RenderMode="Lightweight" ID="ShippedDatePicker" runat="server" Width="100px" ClientEvents-OnDateSelected="DateSelected"
                                DbSelectedDate='<%# SetShippedDate(Container) %>' />
                            <telerik:RadScriptBlock ID="RadScriptBlock2" runat="server">
                                <script type="text/javascript">
                                    function DateSelected(sender, args) {
                                        var tableView = $find("<%# TryCast(Container, GridItem).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:GridBoundColumn>
                    </Columns>
                </MasterTableView>
            </telerik:RadGrid>
        </div>
    </form>
</body>
</html>

 

and My Code behind

Imports Telerik.Web.UI
 
Public Class GridwithFilter
    Inherits System.Web.UI.Page
 
    Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
        If Not IsPostBack Then
 
        End If
    End Sub
 
    Private Sub rgdFilter_NeedDataSource(sender As Object, e As GridNeedDataSourceEventArgs) Handles rgdFilter.NeedDataSource
        Dim dt As New DataTable()
        dt.Columns.Add("ProductName")
        dt.Columns.Add("ShippedDate", GetType(Date))
        Dim dr As DataRow
        dr = dt.NewRow()
        dr("ProductName") = "Product 1"
        dr("ShippedDate") = DateTime.Now
        dt.Rows.Add(dr)
 
        dr = dt.NewRow()
        dr("ProductName") = "Product 2"
        dr("ShippedDate") = DateTime.Now.AddMonths(5)
        dt.Rows.Add(dr)
 
        rgdFilter.DataSource = dt
    End Sub
    Protected Function SetShippedDate(ByVal container As GridItem) As System.Nullable(Of DateTime)
        If container.OwnerTableView.GetColumn("ShippedDate").CurrentFilterValue = String.Empty Then
            Return New System.Nullable(Of DateTime)()
        Else
            Return DateTime.Parse(container.OwnerTableView.GetColumn("ShippedDate").CurrentFilterValue)
        End If
    End Function
End Class

 

Regards

Rajesh

No answers yet. Maybe you can help?

Tags
Grid
Asked by
Rajeesh
Top achievements
Rank 1
Share this question
or