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

<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Untitled Page</title>

    

</head>
<body>
    <form id="form1" runat="server">
        <asp:ScriptManager ID="ScriptManager1" runat="server" />
        <div>
        <telerik:RadScriptBlock ID="RadScriptBlock1" runat="server">

        <script type="text/javascript">
        var selecting;
        var grid;
        var checkBox;
        function pageLoad()
        {         
            debugger;
            checkBox = $get($get('<%= HiddenField1.ClientID %>').value)
            $addHandler(checkBox, "click", onclickHandler);
            grid = $find('<%=RadGrid1.ClientID %>')
            // access the grid items, so that they are created and we can use grid selected items count is calculated correctly, bug -- will be fixed in Q1
            var tmp = grid.get_masterTableView().get_dataItems().length;
            if (parseInt($get('<%= HiddenField2.ClientID %>').value, 10) + grid.get_masterTableView().get_selectedItems().length == grid.get_masterTableView().get_dataItems().length)
            {
                checkBox.checked = true;
            }
        }
        function onclickHandler()
        {
           if (grid.get_masterTableView().get_selectedItems().length > 0)
           {        
                checkBox.checked = true;
           }
           else
           {
                checkBox.checked = false;
           }
        }
        var selecting = true;
       
        function RowSelecting(sender, args)
        {
            var id = args.get_id();
            var inputCheckBox = $get(id).getElementsByTagName("input")[0];
            if (!inputCheckBox || inputCheckBox.disabled)
            {
                //cancel selection for disabled rows
                args.set_cancel(true);
            }
            // if no more unselected enabled rows left - check the header checkbox
            else if (parseInt($get('<%= HiddenField2.ClientID %>').value, 10) + grid.get_masterTableView().get_selectedItems().length + 1 == grid.get_masterTableView().get_dataItems().length)
            {
                checkBox.checked = true;
            }
        }
        function RowDeselecting(sender, args)
        {
                checkBox.checked = false;
        }
 
        </script>

    </telerik:RadScriptBlock>
            <telerik:RadGrid ID="RadGrid1" runat="server" DataSourceID="SqlDataSource1" AllowMultiRowSelection="true"
                OnItemCreated="RadGrid1_ItemCreated" AllowSorting="true">
                <MasterTableView DataSourceID="SqlDataSource1">
                    <Columns>
                        <telerik:GridClientSelectColumn UniqueName="ClientSelectColumn" />
                    </Columns>
                </MasterTableView>
                <ClientSettings>
                    <Selecting AllowRowSelect="True"></Selecting>
                    <ClientEvents OnRowSelecting="RowSelecting" OnRowDeselecting="RowDeselecting" />
                </ClientSettings>
            </telerik:RadGrid>
            <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString %>"
                SelectCommand="SELECT TOP 10 CustomerID, CompanyName, ContactName, ContactTitle, Address, PostalCode FROM Customers">
            </asp:SqlDataSource>
            <asp:HiddenField ID="HiddenField1" runat="server" />
            <asp:HiddenField ID="HiddenField2" runat="server" />
        </div>
    </form>
</body>
</html>
