<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="Default" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <telerik:RadStyleSheetManager ID="RadStyleSheetManager1" runat="server" />
</head>
<body>
    <form id="form1" runat="server">
    <telerik:RadScriptManager ID="RadScriptManager1" runat="server">
        <Scripts>
            <%--Needed for JavaScript IntelliSense in VS2010--%>
            <%--For VS2008 replace RadScriptManager with ScriptManager--%>
            <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.Core.js" />
            <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQuery.js" />
            <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQueryInclude.js" />
        </Scripts>
    </telerik:RadScriptManager>
    <script type="text/javascript">

        var column = null;
        var columnName = null;


        function MenuShowing(sender, args) {


            if (column == null) return;
            if (columnName == null) return;


            var menu = sender; var items = menu.get_items();


            if (columnName == "OrderDate") {


                var i = 0;


                while (i < items.get_count()) {


                    if (!(items.getItem(i).get_value() in { 'NoFilter': '', 'Contains': '', 'GreaterThan': '', 'LessThan': '' })) {
                        var item = items.getItem(i);
                        if (item != null)
                            item.set_visible(false);
                    }
                    else {
                        var item = items.getItem(i);
                        if (item != null)
                            item.set_visible(true);
                    } i++;


                }


            }
            else {
                if (columnName == "ShipName") {


                    var j = 0;


                    while (j < items.get_count()) {


                        if (!(items.getItem(j).get_value() in { 'NoFilter': '', 'Contains': '', 'StartsWith': '', 'EndsWith': '' })) {
                            var item = items.getItem(j);
                            if (item != null)
                                item.set_visible(false);
                        }
                        else {
                            var item = items.getItem(j);
                            if (item != null)
                                item.set_visible(true);
                        } j++;


                    }


                }


            }


            column = null;
            columnName = null;


        }


        function filterMenuShowing(sender, eventArgs) {
            column = eventArgs.get_column();
            columnName = eventArgs.get_column().get_uniqueName();
        }
 


    </script>
    <div>
        <telerik:RadGrid AutoGenerateColumns="false" ID="RadGrid1" Skin="WebBlue" DataSourceID="SqlDataSource1"
            Width="760px" AllowFilteringByColumn="True" AllowSorting="True" PageSize="15"
            ShowFooter="True" AllowPaging="True" runat="server" GridLines="None" EnableLinqExpressions="false">
            <PagerStyle Mode="NextPrevAndNumeric" />
            <GroupingSettings CaseSensitive="false" />
            <MasterTableView AutoGenerateColumns="false" EditMode="InPlace" AllowFilteringByColumn="True"
                ShowFooter="True" TableLayout="Auto">
                <Columns>
                    <telerik:GridNumericColumn DataField="OrderID" HeaderText="OrderID" SortExpression="OrderID"
                        UniqueName="OrderID">
                    </telerik:GridNumericColumn>
                    <telerik:GridBoundColumn DataField="ShipName" HeaderText="ShipName" SortExpression="ShipName"
                        UniqueName="ShipName">
                    </telerik:GridBoundColumn>
                    <telerik:GridDateTimeColumn DataField="OrderDate" HeaderText="OrderDate" SortExpression="OrderDate"
                        UniqueName="OrderDate" PickerType="None" DataFormatString="{0:d}">
                    </telerik:GridDateTimeColumn>
                    <telerik:GridDateTimeColumn DataField="ShippedDate" HeaderText="ShippedDate" SortExpression="ShippedDate"
                        UniqueName="ShippedDate" PickerType="DatePicker" DataFormatString="{0:D}">
                        <HeaderStyle Width="160px" />
                    </telerik:GridDateTimeColumn>
                    <telerik:GridBoundColumn DataField="ShipCountry" HeaderText="ShipCountry" SortExpression="ShipCountry"
                        UniqueName="ShipCountry">
                    </telerik:GridBoundColumn>
                    <telerik:GridTemplateColumn DataField="ShipCity" GroupByExpression="ShipCity Group by ShipCity"
                        UniqueName="ShipCity" InitializeTemplatesFirst="false" HeaderStyle-Width="100"
                        HeaderText="Ship city">
                        <HeaderTemplate>
                            <table>
                                <tr>
                                    <td>
                                        <asp:LinkButton ID="lnkSort" runat="server" CommandArgument="ShipCity" CommandName="Sort"
                                            Text="Ship city"></asp:LinkButton>
                                    </td>
                                    <td>
                                        <img src="Img/Menu.gif" style="margin-top: 5px; margin-left: 5px; cursor: pointer"
                                            onclick='ShowColumnHeaderMenu(event,"ShipCity")' alt="Show context menu" />
                                    </td>
                                </tr>
                            </table>
                        </HeaderTemplate>
                        <ItemTemplate>
                            <asp:Label ID="lblCity" runat="server" Text='<%#Eval("ShipCity") %>'></asp:Label>
                        </ItemTemplate>
                    </telerik:GridTemplateColumn>
                    <telerik:GridMaskedColumn DataField="ShipPostalCode" HeaderText="ShipPostalCode"
                        SortExpression="ShipPostalCode" UniqueName="ShipPostalCode" Mask="#####">
                        <FooterStyle Font-Bold="true" />
                    </telerik:GridMaskedColumn>
                    <telerik:GridNumericColumn DataField="Freight" DataType="System.Decimal" HeaderText="Freight"
                        SortExpression="Freight" UniqueName="Freight" Aggregate="Sum">
                        <FooterStyle Font-Bold="true" />
                    </telerik:GridNumericColumn>
                </Columns>
            </MasterTableView>
            <ClientSettings>
                <Scrolling AllowScroll="false" />
                <ClientEvents OnFilterMenuShowing="filterMenuShowing" />
            </ClientSettings>
            <FilterMenu OnClientShown="MenuShowing" />
        </telerik:RadGrid>
        <br />
        <asp:SqlDataSource ID="SqlDataSource1" ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString %>"
            ProviderName="System.Data.SqlClient" SelectCommand="SELECT * FROM Orders" runat="server">
        </asp:SqlDataSource>
    </div>
    </form>
</body>
</html>
