GanttSettings.SettingsToolbar Property

Contains toolbar settings.

Namespace: DevExpress.Web.Mvc

Assembly: DevExpress.Web.Mvc5.v24.2.dll

Declaration

C#

public GanttToolbarSettings SettingsToolbar { get; }

VB.NET

Public ReadOnly Property SettingsToolbar As GanttToolbarSettings

Property Value

Type	Description
GanttToolbarSettings	Toolbar settings.

Remarks

The GanttExtension allows you to display the most frequently used commands in the toolbar. Use the Visible property to show or hide the toolbar.

The toolbar has a set of predefined items and supports custom items. Use the Items collection to access toolbar items.

Run Demo: MVCxGantt - Toolbar

Available toolbar item types:

Toolbar Item Type	Description
GanttAddTaskToolbarItem	A toolbar item that adds a task.
GanttCollapseAllToolbarItem	A toolbar item that collapses all tasks.
GanttExpandAllToolbarItem	A toolbar item that expands all tasks.
GanttFullScreenToolbarItem	A toolbar item that switches the control to full screen mode.
GanttRedoToolbarItem	A toolbar item that repeats the undone action.
GanttRemoveTaskToolbarItem	A toolbar item that removes a task.
GanttUndoToolbarItem	A toolbar item that reverses an action.
GanttZoomInToolbarItem	A toolbar item that zooms in.
GanttCustomToolbarItem	A custom toolbar item.
GanttZoomOutToolbarItem	A toolbar item that zooms out.

Create a Standard Toolbar Item

Create any of supported standard toolbar items, specify its Text property, and add this toolbar item to the Items collection.

Razor C#

@Html.DevExpress().Gantt(settings => {    
    settings.SettingsToolbar.Items.Add(new GanttZoomInToolbarItem() { Text = "Zoom In" });
    settings.SettingsToolbar.Items.Add(new GanttZoomOutToolbarItem() { Text = "Zoom Out" });
    //...
}).Bind(GanttDataProvider.Tasks).GetHtml()

Create a Custom Toolbar Item

Create a GanttCustomToolbarItem object, specify its Text and CommandName properties, and add this toolbar item to the Items collection. To handle the toolbar item click, handle the CustomCommand event.

Razor C#

@Html.DevExpress().Gantt(settings => {    
    settings.SettingsToolbar.Items.AddCustomItem(i => {
        i.Text = "About";
        i.CommandName = "About";
        i.BeginGroup = true;
        i.Image.IconID = "iconbuilder_actions_info_svg_gray_16x16";
    });
    //...
}).Bind(GanttDataProvider.Tasks).GetHtml()

JS

function CustomCommand(s, e) {
    if (e.commandName == "About")
        alert('Sample message');
}

Show and Hide Toolbar

Set the Visible property to true to hide the toolbar.

Razor C#

@Html.DevExpress().Gantt(settings => {    
    settings.SettingsToolbar.Visible = false;
    //...
}).Bind(GanttDataProvider.Tasks).GetHtml()

Change Toolbar Alignment

Set the Alignment property to one of the GanttToolbarAlignment enumeration values to change the toolbar alignment.

Razor C#

@Html.DevExpress().Gantt(settings => {    
    settings.SettingsToolbar.Alignment = GanttToolbarAlignment.Right;
    //...
}).Bind(GanttDataProvider.Tasks).GetHtml()