Gantt - Defining Columns

Demo Configurator

Select column


Column Properties
  • Visible
  • Editable
  • Sortable
  • Width
Isolate this demo as a stand-alone application
  • About this demo
  • C#
  • VB

This demos shows supported columns features:

  • Auto Generated Columns
  • Columns Visibility
  • Columns Width
  • Columns Sorting
  • Columns Editing
  • DefaultCS.aspx
  • DefaultCS.aspx.cs
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="DefaultCS.aspx.cs" Inherits="Telerik.Web.Examples.GanttExamples.Functionality.DefiningColumns.DefaultCS"  %>

<!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" />

    <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server" DefaultLoadingPanelID="RadAjaxLoadingPanel1">
        <AjaxSettings>
            <telerik:AjaxSetting AjaxControlID="ConfiguratorPanel">
                <UpdatedControls>
                    <telerik:AjaxUpdatedControl ControlID="RadGantt1" />
                    <telerik:AjaxUpdatedControl ControlID="ConfiguratorPanel" />
                </UpdatedControls>
            </telerik:AjaxSetting>
        </AjaxSettings>
    </telerik:RadAjaxManager>

    <telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server"></telerik:RadAjaxLoadingPanel>

    <div class="demo-container no-bg">
        <telerik:RadGantt RenderMode="Lightweight" runat="server" ID="RadGantt1" AutoGenerateColumns="true" Height="450px" SelectedView="MonthView" />
    </div>


    <qsf:ConfiguratorPanel ID="ConfiguratorPanel" runat="server">
        <Views>
            <qsf:View>
                <qsf:ConfiguratorColumn ID="ConfiguratorColumn1" Title="Select column" runat="server" Size="Narrow">
                    <qsf:RadioButtonList ID="Columns" runat="server" AutoPostBack="true" 
                        OnSelectedIndexChanged="Columns_SelectedIndexChanged" Orientation="Vertical">
                        <asp:ListItem Text="Title" Value="1" Selected="True" />
                        <asp:ListItem Text="Start Date" Value="2" />
                        <asp:ListItem Text="End Date" Value="3" />
                        <asp:ListItem Text="Percent Complete" Value="4" />
                    </qsf:RadioButtonList>
                </qsf:ConfiguratorColumn>
                <qsf:ConfiguratorColumn ID="ConfiguratorColumn2" Title="Column Properties" runat="server" Size="Medium">
                    <ul class="fb-group">
                        <li>
                            <span class="label">Visible</span>
                            <qsf:RadioButtonList ID="ColumnVisibility" runat="server" Orientation="Horizontal"
                                AutoPostBack="true" OnSelectedIndexChanged="ConfigureColumn">
                                <asp:ListItem Text="True" Selected="True" />
                                <asp:ListItem Text="False" />
                            </qsf:RadioButtonList>
                        </li>
                        <li>
                            <span class="label">Editable</span>
                            <qsf:RadioButtonList ID="ColumnEditing" runat="server" Orientation="Horizontal"
                                AutoPostBack="true" OnSelectedIndexChanged="ConfigureColumn">
                                <asp:ListItem Text="True" Selected="True" />
                                <asp:ListItem Text="False" />
                            </qsf:RadioButtonList>
                        </li>
                        <li>
                            <span class="label">Sortable</span>
                            <qsf:RadioButtonList ID="ColumnSorting" runat="server" Orientation="Horizontal"
                                AutoPostBack="true" OnSelectedIndexChanged="ConfigureColumn">
                                <asp:ListItem Text="True" Selected="True" />
                                <asp:ListItem Text="False" />
                            </qsf:RadioButtonList>
                        </li>
                        <li>
                            <span class="label">Width</span>
                            <qsf:NumericTextBox runat="server" ID="ColumnWidth" MaxLength="3" Size="Narrow" MaxValue="600" IncrementSettings-Step="20"
                                MinValue="0" Type="Number" NumberFormat-DecimalDigits="0" NumberFormat-KeepNotRoundedValue="false" />
                            <qsf:Button runat="server" ID="ResizeButton" Text="Resize" Size="Narrow" OnClick="ConfigureColumn" />
                        </li>
                    </ul>
                </qsf:ConfiguratorColumn>
            </qsf:View>
        </Views>
    </qsf:ConfiguratorPanel>
    </form>
</body>
</html>

Support & Learning Resources

Find Assistance

Help Us Improve

Was this example helpful?