OrgChart - Rendered Fields

  • Team: Management
    • CEO
      Certificates: MCAD
    • CTO
      Certificates: MCP
    • Team: Unit
      • UnitManager
        Certificates: MCSD
      • Team: Dev
        • TeamLead
          Certificates: MCTS
      • Team: Research
        • TechnicalLead
          Certificates: MCP
Isolate this demo as a stand-alone application
  • About this demo
  • C#
  • VB

RadOrgChart supports rendering of custom fields for Nodes and Items. Using RenderedFields you can add an extra information about every Node or Item in RadOrgChart. To be able to set custom fields on a Node you need to use Group-Enabled Binding.

RenderedFields, for Nodes or Items, can be set from the mark up in section RenderedFields or in codebind.

  • DataField - this is the field name from the data source that populates each custom field's text property during binding.
  • Label - short description about custom field's text. It is optional.
  • DefaultCS.aspx
  • DefaultCS.aspx.cs
<%@ Page Language="c#" CodeFile="DefaultCS.aspx.cs" AutoEventWireup="true" Inherits="OrgChart.Examples.RenderedFields.DefaultCS" %>
<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>

<!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>Telerik ASP.NET Example</title>
</head>

<body>
    <form id="form1" runat="server">
    <telerik:RadScriptManager runat="server" ID="RadScriptManager1" />
    <telerik:RadSkinManager ID="RadSkinManager1" runat="server" ShowChooser="true" />

    <div class="demo-container no-bg">

        <telerik:RadOrgChart RenderMode="Lightweight" ID="RadOrgChart1" runat="server">
            <RenderedFields>
                <NodeFields>
                    <telerik:OrgChartRenderedField DataField="TeamName" Label="Team" />
                </NodeFields>
                <ItemFields>
                    <telerik:OrgChartRenderedField DataField="Certificates" Label="Certificates" />
                </ItemFields>
            </RenderedFields>
        </telerik:RadOrgChart>

    </div>

    </form>
</body>
</html>

Support & Learning Resources

Find Assistance

Help Us Improve

Was this example helpful?