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

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>

<html>
<head>
    <title>Test</title>
    <telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">
        <script type="text/javascript">

    var hasChanges, inputs, dropdowns, editedRow;
 
    function RowClick(sender, eventArgs) {
        if (editedRow && hasChanges) {
            hasChanges = false;
            if (confirm("Update changes?")) {
 
                $find("<%= RadGrid1.ClientID %>").get_masterTableView().updateItem(editedRow);
                    }
                }
            }
 
            function RowDblClick(sender, eventArgs) {
                editedRow = eventArgs.get_itemIndexHierarchical();
                $find("<%= RadGrid1.ClientID %>").get_masterTableView().editItem(editedRow);
            }
 
            function GridCommand(sender, args) {
                if (args.get_commandName() != "Edit") {
                    editedRow = null;
                }
            }
 
            function GridCreated(sender, eventArgs) {
                var gridElement = sender.get_element();
                var elementsToUse = [];
                inputs = gridElement.getElementsByTagName("input");
                for (var i = 0; i < inputs.length; i++) {
                    var lowerType = inputs[i].type.toLowerCase();
                    if (lowerType == "hidden" || lowerType == "button") {
                        continue;
                    }
                    if (inputs[i].id.indexOf("PageSizeComboBox") == -1 && inputs[i].type.toLowerCase() != "checkbox") {
                        Array.add(elementsToUse, inputs[i]);
                    }
                    inputs[i].onchange = TrackChanges;
                }
 
                dropdowns = gridElement.getElementsByTagName("select");
                for (var i = 0; i < dropdowns.length; i++) {
                    dropdowns[i].onchange = TrackChanges;
                }
 
                setTimeout(function () { if (elementsToUse[0]) elementsToUse[0].focus(); }, 100);
            }
 
            function TrackChanges(e) {
                hasChanges = true;
            }
            function KeyPress(sender,args) {
                if (args.get_keyCode() === 13 && editedRow) {
                    $find("<%= RadGrid1.ClientID %>").get_masterTableView().updateItem(editedRow);
                }
            }
        </script>
    </telerik:RadCodeBlock>
</head>
<body>
    <form id="Form1" runat="server">
        <telerik:RadScriptManager runat="server"></telerik:RadScriptManager>
         <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
        <AjaxSettings>
            <telerik:AjaxSetting AjaxControlID="RadGrid1">
                <UpdatedControls>
                    <telerik:AjaxUpdatedControl ControlID="RadGrid1"></telerik:AjaxUpdatedControl>
                    <telerik:AjaxUpdatedControl ControlID="Label1"></telerik:AjaxUpdatedControl>
                </UpdatedControls>
            </telerik:AjaxSetting>
        </AjaxSettings>
    </telerik:RadAjaxManager>
         <telerik:RadGrid ID="RadGrid1" DataSourceID="SqlDataSource1" Width="97%" ShowStatusBar="True"
        AllowSorting="True" PageSize="7" GridLines="None" AllowPaging="True" runat="server"
        AllowAutomaticUpdates="True" AutoGenerateColumns="False">
        <MasterTableView TableLayout="Fixed" DataKeyNames="ProductID" EditMode="InPlace">
            <Columns>
                <telerik:GridBoundColumn UniqueName="ProductID" DataField="ProductID" HeaderText="ProductID"
                    ReadOnly="True" HeaderStyle-Width="10%">
                </telerik:GridBoundColumn>
                <telerik:GridBoundColumn UniqueName="ProductName" DataField="ProductName" HeaderText="Product name"
                    HeaderStyle-Width="25%" ColumnEditorID="GridTextBoxColumnEditor1">
                </telerik:GridBoundColumn>
                <telerik:GridBoundColumn UniqueName="QuantityPerUnit" DataField="QuantityPerUnit"
                    HeaderText="Quantity" HeaderStyle-Width="20%">
                </telerik:GridBoundColumn>
                <telerik:GridNumericColumn UniqueName="UnitPrice" DataField="UnitPrice" HeaderText="UnitPrice"
                    DataFormatString="{0:C}" HeaderStyle-Width="10%">
                </telerik:GridNumericColumn>
                <telerik:GridDropDownColumn UniqueName="UnitsInStock" HeaderText="In stock" ColumnEditorID="GridDropDownListColumnEditor1"
                    ListTextField="UnitsInStock" ListValueField="UnitsInStock" DataSourceID="SqlDataSource1"
                    DataField="UnitsInStock" HeaderStyle-Width="10%">
                </telerik:GridDropDownColumn>
                <telerik:GridCheckBoxColumn UniqueName="Discontinued" DataField="Discontinued" HeaderText="Discontinued"
                    HeaderStyle-Width="10%">
                </telerik:GridCheckBoxColumn>
            </Columns>
        </MasterTableView>
        <ClientSettings AllowKeyboardNavigation="true">
            <Selecting AllowRowSelect="true"></Selecting>
            <KeyboardNavigationSettings EnableKeyboardShortcuts="true" AllowSubmitOnEnter="true"
              >
            </KeyboardNavigationSettings>
            <ClientEvents OnRowClick="RowClick" OnRowDblClick="RowDblClick" OnGridCreated="GridCreated"
                OnCommand="GridCommand" OnKeyPress="KeyPress" ></ClientEvents>
        </ClientSettings>
    </telerik:RadGrid>
    <telerik:GridTextBoxColumnEditor ID="GridTextBoxColumnEditor1" runat="server" TextBoxStyle-Width="180px">
    </telerik:GridTextBoxColumnEditor>
    <telerik:GridDropDownListColumnEditor ID="GridDropDownListColumnEditor1" runat="server"
        DropDownStyle-Width="70px">
    </telerik:GridDropDownListColumnEditor>
    <telerik:GridCheckBoxColumnEditor ID="GridCheckBoxColumnEditor1" runat="server" CheckBoxStyle-BorderWidth="2">
    </telerik:GridCheckBoxColumnEditor>
    <br />
    <asp:Label ID="Label1" runat="server" EnableViewState="false"></asp:Label>
    <br />
    <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString35 %>"
        SelectCommand="SELECT * FROM [Products]" UpdateCommand="UPDATE [Products] SET [ProductName] = @ProductName, [QuantityPerUnit] = @QuantityPerUnit, [UnitPrice] = @UnitPrice, [UnitsInStock] = @UnitsInStock, [Discontinued] = @Discontinued WHERE [ProductID] = @ProductID">
        <UpdateParameters>
            <asp:Parameter Name="ProductName" Type="String"></asp:Parameter>
            <asp:Parameter Name="QuantityPerUnit" Type="String"></asp:Parameter>
            <asp:Parameter Name="UnitPrice" Type="Decimal"></asp:Parameter>
            <asp:Parameter Name="UnitsInStock" Type="Int16"></asp:Parameter>
            <asp:Parameter Name="Discontinued" Type="Boolean"></asp:Parameter>
            <asp:Parameter Name="ProductID" Type="Int32"></asp:Parameter>
        </UpdateParameters>
    </asp:SqlDataSource>
    </form>
</body>
</html>
