<%@ Page Title="Home Page" Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true"
    CodeFile="Default.aspx.cs" Inherits="_Default" %>

<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>
<asp:Content ID="HeaderContent" runat="server" ContentPlaceHolderID="HeadContent">
</asp:Content>
<asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent">
    <telerik:RadAjaxLoadingPanel runat="server" ID="loadingPanel1" Skin="Default"></telerik:RadAjaxLoadingPanel>
    <telerik:RadAjaxPanel runat="server" ID="RadAjaxPanel1" LoadingPanelID="loadingPanel1">
        <telerik:RadGrid runat="server" ID="RadGrid1" AllowSorting="true" AllowPaging="true" AllowFilteringByColumn="true"
            AutoGenerateColumns="False" CellSpacing="0" GridLines="None">
            <MasterTableView DataKeyNames="ID" CommandItemDisplay="Top">
                <Columns>
                    <telerik:GridBoundColumn DataField="ID" HeaderText="ID">
                    </telerik:GridBoundColumn>
                    <telerik:GridBoundColumn DataField="Item" HeaderText="Item">
                    </telerik:GridBoundColumn>
                    <telerik:GridBoundColumn DataField="Date" HeaderText="Date">
                        <FilterTemplate>
                            Enter month number:
                            <telerik:RadTextBox runat="server">
                               <ClientEvents OnValueChanged="OnValueChanged" />
                            </telerik:RadTextBox>
                        <telerik:RadScriptBlock ID="RadScriptBlock2" runat="server">
                            <script type="text/javascript">
                                function OnValueChanged(sender, args) {
                                    var monthNumber = args.get_newValue();
                                    var tableView = $find("<%# ((GridItem)Container).OwnerTableView.ClientID %>");
                                    tableView.filter("Date", "/" + monthNumber + "/", "Contains");
                                }
                            </script>
                        </telerik:RadScriptBlock>
                        </FilterTemplate>
                    </telerik:GridBoundColumn>
                </Columns>
            </MasterTableView>
        </telerik:RadGrid>
    </telerik:RadAjaxPanel>
</asp:Content>
