Telerik is a leading vendor of ASP.NET AJAX, ASP.NET MVC, Silverlight, WinForms and WPF controls and components, as well as .NET Reporting, .NET ORM , .NET CMS, Code Analysis, Mocking, Team Productivity and Automated Testing Tools. Building on its expertise in interface development and Microsoft technologies, Telerik helps customers build applications with unparalleled richness, responsiveness and interactivity. Telerik products help thousands of companies to be more productive and deliver reliable applications under budget and on time.
Version Q1 2012 released 04/11/2012
select

Grid / Using Column Editors

Example Configuration
     

Add new recordRefresh
 First nameLast nameTitle of courtesyHire date 
NancyDavolioMs.5/1/1992
Edit details for employee with ID 1
select
 
AndrewFullerDr.8/14/1992
JanetLeverlingMs.4/1/1992
MargaretPeacockMrs.5/3/1993
StevenBuchananMr.10/17/1993
MichaelSuyamaMr.10/17/1993
RobertKingMr.1/2/1994
LauraCallahanMs.3/5/1994
AnneDodsworthMs.11/15/1994

  • To test the editing capabilities on this demo:
    • Edit/Update/Insert/Delete records by pressing the corresponding buttons or double-clicking a record
    • Switch the edit modes using the options at the top of the page
    • Enable/Disable Multiline edit mode

Source Code

C# VB.NET
Show code in new window Demo isolation steps
  • <%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>
    <%@ Register TagPrefix="telerik" TagName="Footer" Src="~/Common/Footer.ascx" %>
    <%@ Register TagPrefix="telerik" TagName="HeadTag" Src="~/Common/HeadTag.ascx" %>
    <%@ Register TagPrefix="telerik" TagName="Header" Src="~/Common/Header.ascx" %>
    <%@ Register TagPrefix="telerik" Namespace="Telerik.QuickStart" %>

    <%@ Page Language="VB" AutoEventWireup="false" Inherits="Telerik.GridExamplesVBNET.DataEditing.EditModes.DefaultVB"
        CodeFile="DefaultVB.aspx.vb" %>

    <!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">
        <telerik:HeadTag runat="server" ID="Headtag2"></telerik:HeadTag>
        <!-- end of custom head section -->
    </head>
    <body class="BODY">
        <form runat="server" id="mainForm" method="post">
            <telerik:Header runat="server" ID="Header1" NavigationLanguage="VB"></telerik:Header>
            <telerik:RadScriptManager ID="RadScriptManager1" runat="server"></telerik:RadScriptManager>
            <!-- content start -->
            <telerik:ConfiguratorPanel ID="ConfiguratorPanel1" runat="server" Expanded="true">
                <div class="module" style="height: 40px; width: 92%;">
                    <div style="float: left;">
    <asp:RadioButton ID="RadioButton1" AutoPostBack="True" Text="In-forms editing mode"
    runat="server" Checked="True"></asp:RadioButton>

    <asp:RadioButton ID="RadioButton2" AutoPostBack="True" Text="In-line editing mode"
    runat="server"></asp:RadioButton>

                        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                    </div>
                    <div style="float: left; margin: 10px;">
                        <asp:CheckBox ID="CheckBox1" Text="Allow multi-row edit" AutoPostBack="True" runat="server">
                        </asp:CheckBox>
                    </div>
                    <div style="clear: both;">
                    </div>
                </div>
            </telerik:ConfiguratorPanel>
            <br />

            <telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">

                <script type="text/javascript">
                function RowDblClick(sender, eventArgs)
                {
                  sender.get_masterTableView().editItem(eventArgs.get_itemIndexHierarchical());
                }
                </script>

            </telerik:RadCodeBlock>
            <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
                <AjaxSettings>
                    <telerik:AjaxSetting AjaxControlID="RadGrid1">
                        <UpdatedControls>
                            <telerik:AjaxUpdatedControl ControlID="RadGrid1" LoadingPanelID="RadAjaxLoadingPanel1" />
                        </UpdatedControls>
                    </telerik:AjaxSetting>
                    <telerik:AjaxSetting AjaxControlID="RadioButton1">
                        <UpdatedControls>
                            <telerik:AjaxUpdatedControl ControlID="RadGrid1" LoadingPanelID="RadAjaxLoadingPanel1" />
                            <telerik:AjaxUpdatedControl ControlID="RadioButton2" />
                        </UpdatedControls>
                    </telerik:AjaxSetting>
                    <telerik:AjaxSetting AjaxControlID="RadioButton2">
                        <UpdatedControls>
                            <telerik:AjaxUpdatedControl ControlID="RadGrid1" LoadingPanelID="RadAjaxLoadingPanel1" />
                            <telerik:AjaxUpdatedControl ControlID="RadioButton1" />
                        </UpdatedControls>
                    </telerik:AjaxSetting>
                    <telerik:AjaxSetting AjaxControlID="CheckBox1">
                        <UpdatedControls>
                            <telerik:AjaxUpdatedControl ControlID="RadGrid1" LoadingPanelID="RadAjaxLoadingPanel1" />
                        </UpdatedControls>
                    </telerik:AjaxSetting>
                </AjaxSettings>
            </telerik:RadAjaxManager>
            <telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server" />
            <telerik:RadGrid ID="RadGrid1" runat="server" Width="96%" GridLines="None"
                AutoGenerateColumns="False" PageSize="13" AllowSorting="True" AllowPaging="True"
                ShowStatusBar="true">
                <MasterTableView DataKeyNames="EmployeeID" AllowMultiColumnSorting="True" Width="100%"
                    CommandItemDisplay="Top">
                    <Columns>
                        <telerik:GridButtonColumn UniqueName="DeleteColumn" CommandName="Delete" ButtonType="PushButton" Text="Delete" />
                        <telerik:GridBoundColumn UniqueName="FirstName" SortExpression="FirstName" HeaderText="First name"
                            DataField="FirstName" />
                        <telerik:GridBoundColumn UniqueName="LastName" SortExpression="LastName" HeaderText="Last name"
                            DataField="LastName" />
                        <telerik:GridDropDownColumn UniqueName="TitleOfCourtesy" ListDataMember="Employees"
                            SortExpression="TitleOfCourtesy" ListTextField="TitleOfCourtesy" ListValueField="TitleOfCourtesy"
                            HeaderText="Title of courtesy" DataField="TitleOfCourtesy">
                        </telerik:GridDropDownColumn>
                        <telerik:GridDateTimeColumn UniqueName="HireDate" SortExpression="HireDate" HeaderText="Hire date"
                            DataField="HireDate" DataFormatString="{0:d}" />
                        <telerik:GridEditCommandColumn ButtonType="PushButton" UniqueName="EditCommandColumn">
                            <HeaderStyle Width="85px"></HeaderStyle>
                        </telerik:GridEditCommandColumn>
                    </Columns>
                    <EditFormSettings CaptionFormatString="Edit details for employee with ID {0}" CaptionDataField="EmployeeID">
                        <FormTableItemStyle Width="100%" Height="29px"></FormTableItemStyle>
                        <FormTableStyle GridLines="None" CellSpacing="0" CellPadding="2"></FormTableStyle>
                        <FormStyle Width="100%" BackColor="#eef2ea"></FormStyle>
                        <EditColumn ButtonType="ImageButton" />
                    </EditFormSettings>
                </MasterTableView>
                <ClientSettings>
                    <ClientEvents OnRowDblClick="RowDblClick" />
                </ClientSettings>
            </telerik:RadGrid>
            <!-- content end -->
            <telerik:Footer runat="server" ID="Footer1"></telerik:Footer>
        </form>
    </body>
    </html>

Get more than expected!

Take your time to truly experience the power of RadControls for ASP.NET AJAX with a free 60-day trial backed up by Telerik’s unlimited dedicated support.

Download your RadControls for ASP.NET AJAX trial and jumpstart your development with the available Getting Started resources.

If you have any questions, do not hesitate to contact us at sales@telerik.com.

Copyright 2002-2012 © Telerik. All right reserved
Telerik Inc, 201 Jones Rd, Waltham, MA 02451