<%@ Page EnableViewState="false" Language="C#" %>

<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>
<!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 id="Head1" runat="server">
    <title>Untitled Page</title>
    <telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">

        <script type="text/javascript">
            var commandName = "";
            var tableView = null;

            function pageLoad(sender, args)
            {
                tableView = $find("<%= RadGrid1.ClientID %>").get_masterTableView();

                commandName = "Load"

                WebService.GetData(0, tableView.get_pageSize(),
                    tableView.get_sortExpressions().toString(), tableView.get_filterExpressions().toDynamicLinq(),
                        updateGrid);
            }

            function RadGrid1_Command(sender, args)
            {
                args.set_cancel(true);

                commandName = args.get_commandName();

                WebService.GetData(tableView.get_currentPageIndex() * tableView.get_pageSize(), tableView.get_pageSize(),
                    tableView.get_sortExpressions().toString(), tableView.get_filterExpressions().toDynamicLinq(),
                        updateGrid);
            }

            function updateGrid(result)
            {
                tableView.set_dataSource(result);
                tableView.dataBind();

                if (commandName == "Filter" || commandName == "Load")
                {
                    WebService.GetCount(updateVirtualItemCount);
                }
            }

            function updateVirtualItemCount(result)
            {
                tableView.set_virtualItemCount(result);
            }
        </script>

    </telerik:RadCodeBlock>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <telerik:RadScriptManager ID="RadScriptManager1" runat="server">
            <Services>
                <asp:ServiceReference Path="~/WebService.asmx" />
            </Services>
        </telerik:RadScriptManager>
        <telerik:RadStyleSheetManager ID="RadStyleSheetManager1" runat="server" 
            OutputCompression="AutoDetect" />
        <telerik:RadGrid ID="RadGrid1" AllowFilteringByColumn="true" Skin="Office2007" runat="server"
            GridLines="None" AllowPaging="true" AllowSorting="true">
            <ClientSettings>
                <ClientEvents OnCommand="RadGrid1_Command" />
            </ClientSettings>
            <MasterTableView>
                <Columns>
                    <telerik:GridBoundColumn SortExpression="CustomerID" DataField="CustomerID" HeaderText="CustomerID" />
                    <telerik:GridBoundColumn SortExpression="CompanyName" DataField="CompanyName" HeaderText="CompanyName" />
                    <telerik:GridBoundColumn SortExpression="ContactName" DataField="ContactName" HeaderText="ContactName" />
                    <telerik:GridBoundColumn SortExpression="ContactTitle" DataField="ContactTitle" HeaderText="ContactTitle" />
                    <telerik:GridBoundColumn SortExpression="Country" DataField="Country" HeaderText="Country" />
                    <telerik:GridBoundColumn SortExpression="City" DataField="City" HeaderText="City" />
                </Columns>
            </MasterTableView>
            <PagerStyle AlwaysVisible="true" />
        </telerik:RadGrid>
    </div>
    </form>
</body>
</html>
