TreeList

Controls

Rate this demo

Thank you for your post!
Submit a support ticket
If you have an active license or trial, you have access to dedicated support from Telerik’s developers. Response time is 24h for active licenses and 72h for trials, Mon-Fri.
Post in the forums
If you don’t have access to support or would like to help other people by sharing your problem, reach out to our active community in the forums.

TreeList - NET 3.5 automatic data editing

Next database reset in 1 hours, 41 minutes, 11 seconds
Configurator

LinqDataSource

 IDNameParent ID
1
Page size:
PageSizeComboBox
select
 1Davolio Nancy 

EntityDataSource

 IDCategoriesParent ID
1
Page size:
PageSizeComboBox
select
 2Politics 
 3Sports 
 4Events 

This example illustrates how automatic insert, update and delete data operations can be achieved with RadTreeList and all ASP 3.5 DataSource control types:

  • LinqDataSource
  • EntityDataSource

What you need to do is to set the following properties:

  • DataSourceID property of the RadTreeList to the ID of the Data Source control
  • EnableUpdate, EnableInsert, EnableDelete properties of the Data Source control to true
  • DataKeyNames and ParentDataKeyNames properties of RadTreeList by listing the data source table Primary keys

The RadTreelist control expects the key to be incremented when you insert items, therefore the new items are located at the bottom of the group.

You may also see how to utilize Telerik OpenAccess ORM as a data access layer for our AJAX controls by visiting the OpenAccess ORM live demos here.

C# VB
Show code in new window Demo isolation steps
<%@ Page Language="c#" CodeFile="~/TreeList/Examples/DataEditing/Net35AutomaticDataEditing/DefaultCS.aspx.cs"Inherits="Telerik.Web.Examples.TreeList.DataEditing.NET35AutomaticDataEditing.DefaultCS"  %>

<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>
<%@ Register TagPrefix="qsf" Namespace="Telerik.QuickStart" %>
<!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>ASP.NET TreeList Demo - NET 3.5 automatic data editing</title>
     <style type="text/css">
          .MyImageButton {
               cursor: pointer;
          }
     </style>
</head>
<body>
    <form id="form1" runat="server">
    <telerik:RadScriptManager runat="server" ID="RadScriptManager1" />
    <telerik:RadSkinManager ID="QsfSkinManager" runat="server" ShowChooser="true" />
    <telerik:RadFormDecorator ID="QsfFromDecorator" runat="server" DecoratedControls="All" EnableRoundedCorners="false" />
     <telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server"></telerik:RadAjaxLoadingPanel>
     <telerik:RadAjaxPanel ID="RadAjaxPanel1" LoadingPanelID="RadAjaxLoadingPanel1" runat="server">
          <qsf:ConfiguratorPanel runat="server" ID="ConfigurationPanel1" Title="Configurator" Expanded="true">
               <p>
                    <label for="RadioButtonList1"> Change Edit Mode:</label>
               </p>
               <div style="float: left;">
                    <asp:RadioButtonList ID="RadioButtonList1" runat="server" AutoPostBack="true" OnSelectedIndexChanged="RadioButtonList1_SelectedIndexChanged" RepeatDirection="Horizontal">
                         <asp:ListItem Text="In-forms editing mode" Value="EditForms" Selected="True"></asp:ListItem>
                         <asp:ListItem Text="In-line editing mode" Value="InPlace"></asp:ListItem>
                         <asp:ListItem Text="Pop-up editing mode" Value="PopUp"></asp:ListItem>
                    </asp:RadioButtonList>
               </div>
               <div style="float: left; margin-left: 70px; margin-top: 3px;">
                    <asp:CheckBox ID="CheckBox1" runat="server" Checked="false" Enabled="false" Text="Modal PopUp edit form" AutoPostBack="true" OnCheckedChanged="CheckBox1_CheckedChanged"></asp:CheckBox>
               </div>
          </qsf:ConfiguratorPanel>
          <h2 class="qsfSubtitle">LinqDataSource
          </h2>
          <telerik:RadTreeList runat="server" ID="RadTreeList1" DataSourceID="LinqDataSource1" AllowPaging="true" PageSize="5" DataKeyNames="ID" ParentDataKeyNames="ParentID" AutoGenerateColumns="false">
               <Columns>
                    <telerik:TreeListEditCommandColumn UniqueName="EditCommandColumn" ButtonType="ImageButton" HeaderStyle-Width="80px">
                         <ItemStyle CssClass="MyImageButton"></ItemStyle>
                    </telerik:TreeListEditCommandColumn>
                    <telerik:TreeListButtonColumn UniqueName="DeleteCommandColumn" Text="Delete" CommandName="Delete" HeaderStyle-Width="40px" ButtonType="ImageButton"></telerik:TreeListButtonColumn>
                    <telerik:TreeListBoundColumn DataField="ID" UniqueName="ID" HeaderText="ID" ReadOnly="true"></telerik:TreeListBoundColumn>
                    <telerik:TreeListBoundColumn DataField="FullName" UniqueName="FullName" HeaderText="Name"></telerik:TreeListBoundColumn>
                    <telerik:TreeListBoundColumn DataField="ParentID" UniqueName="ParentID" HeaderText="Parent ID" ReadOnly="true"></telerik:TreeListBoundColumn>
               </Columns>
          </telerik:RadTreeList>
          <br />
          <h2 class="qsfSubtitle">EntityDataSource
          </h2>
          <telerik:RadTreeList runat="server" ID="RadTreeList2" DataSourceID="EntityDataSource1" AllowPaging="true" PageSize="5" DataKeyNames="id" ParentDataKeyNames="parentId" AutoGenerateColumns="false">
               <Columns>
                    <telerik:TreeListEditCommandColumn UniqueName="EditCommandColumn" ButtonType="ImageButton" HeaderStyle-Width="80px">
                         <ItemStyle CssClass="MyImageButton"></ItemStyle>
                    </telerik:TreeListEditCommandColumn>
                    <telerik:TreeListButtonColumn UniqueName="DeleteCommandColumn" Text="Delete" CommandName="Delete" HeaderStyle-Width="40px" ButtonType="ImageButton"></telerik:TreeListButtonColumn>
                    <telerik:TreeListBoundColumn DataField="id" UniqueName="id" HeaderText="ID" ReadOnly="true"></telerik:TreeListBoundColumn>
                    <telerik:TreeListBoundColumn DataField="Text" UniqueName="Categories" HeaderText="Categories"></telerik:TreeListBoundColumn>
                    <telerik:TreeListBoundColumn DataField="parentid" UniqueName="parentid" HeaderText="Parent ID" ReadOnly="true"></telerik:TreeListBoundColumn>
               </Columns>
          </telerik:RadTreeList>
     </telerik:RadAjaxPanel>
     <asp:LinqDataSource runat="server" ID="LinqDataSource1" ContextTypeName="LinqToSql.TelerikSamplesDataContext" TableName="Employees" EnableUpdate="true" EnableInsert="true" EnableDelete="True">
     </asp:LinqDataSource>
     <asp:EntityDataSource runat="server" ID="EntityDataSource1" ConnectionString="name=TelerikEntities35" DefaultContainerName="TelerikEntities35" EntitySetName="Links" EnableInsert="True" EnableUpdate="True" EnableDelete="True">
     </asp:EntityDataSource>
    </form>
</body>
</html>
Telerik UI for ASP.NET AJAX Q3'14 Release is here