New to Telerik UI for ASP.NET AJAX? Download free 30-day trial

RadGrid Edit Template

   
No records to display.

RadGrid EditTemplate with RadEditor

You can easily integrate the RadEditor directly in a RadGrid, using the standard framework provided by the RadGrid control.

<EditItemTemplate>
    <telerik:RadEditor ID="RadEditor1" runat="server" Content='<%# Bind("Content") %>'>
        <Tools>
            <telerik:EditorToolGroup>
                <telerik:EditorTool Name="Cut" />
                <telerik:EditorTool Name="Copy" />
                <telerik:EditorTool Name="Paste" />
            </telerik:EditorToolGroup>
        </Tools>
    </telerik:RadEditor>
</EditItemTemplate>
<InsertItemTemplate>
    <telerik:RadEditor ID="RadEditor1" runat="server" Content='<%# Bind("Content") %>'>
        <Tools>
            <telerik:EditorToolGroup>
                <telerik:EditorTool Name="Cut" />
                <telerik:EditorTool Name="Copy" />
                <telerik:EditorTool Name="Paste" />
            </telerik:EditorToolGroup>
        </Tools>
    </telerik:RadEditor>                   
</InsertItemTemplate>

  • DefaultCS.aspx
  • DefaultCS.aspx.cs
<%@ Page Theme="Default" CodeFile="DefaultCS.aspx.cs" Language="c#" AutoEventWireup="true"Inherits="Telerik.Web.Examples.Editor.EditTemplate.DefaultCS"  %>

<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>
<!DOCTYPE html>
<html xmlns='http://www.w3.org/1999/xhtml'>
<head runat="server">
    <title>Telerik ASP.NET Example</title>
<link href="../Common/styles.css" rel="stylesheet" type="text/css" />
</head>
<body>
    <form id="form1" runat="server">
    <telerik:RadScriptManager runat="server" ID="RadScriptManager1" />
    <telerik:RadSkinManager ID="RadSkinManager1" runat="server" ShowChooser="true" />
    <telerik:RadAjaxManager runat="server" ID="theAjaxManager">
        <AjaxSettings>
            <telerik:AjaxSetting AjaxControlID="MyDataGrid">
                <UpdatedControls>
                    <telerik:AjaxUpdatedControl ControlID="MyDataGrid" LoadingPanelID="theLoadingPanel" />
                </UpdatedControls>
            </telerik:AjaxSetting>
        </AjaxSettings>
    </telerik:RadAjaxManager>
    <telerik:RadAjaxLoadingPanel ID="theLoadingPanel" runat="server"></telerik:RadAjaxLoadingPanel>
    <div class="demo-container no-bg">
        <telerik:RadGrid RenderMode="Lightweight" ID="MyDataGrid" runat="server" AutoGenerateColumns="False" DataSourceID="SqlDataSource1"
            AllowAutomaticUpdates="true" AllowAutomaticDeletes="true" AllowAutomaticInserts="true"
            AutoGenerateEditColumn="true" AutoGenerateDeleteColumn="true">
            <MasterTableView DataKeyNames="ID" CommandItemDisplay="Top">
                <Columns>
                    <telerik:GridTemplateColumn UniqueName="ID" Display="false">
                        <ItemTemplate>
                            <asp:Label ID="IdLabel" runat="server" Text='<%# Eval("ID") %>'></asp:Label>
                        </ItemTemplate>
                    </telerik:GridTemplateColumn>
                    <telerik:GridTemplateColumn UniqueName="Content">
                        <ItemTemplate>
                            <asp:Label ID="lblField1" CssClass="text" runat="server" Text='<%# Eval("Content") %>'></asp:Label>
                        </ItemTemplate>
                        <EditItemTemplate>
                            <telerik:RadEditor RenderMode="Lightweight" ID="RadEditor1" runat="server" content='<%# Bind("Content") %>'>
                                <Tools>
                                    <telerik:EditorToolGroup>
                                        <telerik:EditorTool Name="Cut"></telerik:EditorTool>
                                        <telerik:EditorTool Name="Copy"></telerik:EditorTool>
                                        <telerik:EditorTool Name="Paste"></telerik:EditorTool>
                                    </telerik:EditorToolGroup>
                                </Tools>
                            </telerik:RadEditor>
                        </EditItemTemplate>
                        <InsertItemTemplate>
                            <telerik:RadEditor RenderMode="Lightweight" ID="RadEditor1" runat="server" content='<%# Bind("Content") %>'>
                                <Tools>
                                    <telerik:EditorToolGroup>
                                        <telerik:EditorTool Name="Cut"></telerik:EditorTool>
                                        <telerik:EditorTool Name="Copy"></telerik:EditorTool>
                                        <telerik:EditorTool Name="Paste"></telerik:EditorTool>
                                    </telerik:EditorToolGroup>
                                </Tools>
                            </telerik:RadEditor>
                        </InsertItemTemplate>
                    </telerik:GridTemplateColumn>
                </Columns>
            </MasterTableView>
        </telerik:RadGrid>
    </div>
    <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:TelerikConnectionString %>"
        SelectCommand="SELECT [ID], [Content] FROM [BlogPosts]" UpdateCommand="UPDATE [BlogPosts] SET [Content] = @Content WHERE [ID] = @ID"
        DeleteCommand="DELETE FROM [BlogPosts] WHERE [ID] = @ID" InsertCommand="INSERT INTO [BlogPosts] ([PublishDate], [Category], [Title], [Content]) VALUES (GETDATE(), 'Foo', 'Bar',@Content)">
        <DeleteParameters>
            <asp:Parameter Name="ID" Type="Int32"></asp:Parameter>
        </DeleteParameters>
        <InsertParameters>
            <asp:Parameter Name="Content" Type="String"></asp:Parameter>
        </InsertParameters>
        <UpdateParameters>
            <asp:Parameter Name="Content" Type="String"></asp:Parameter>
            <asp:Parameter Name="ID" Type="Int32"></asp:Parameter>
        </UpdateParameters>
    </asp:SqlDataSource>
    </form>
</body>
</html>

Support & Learning Resources

Find Assistance