Skip to main content

GanttSettings.SettingsToolbar Property

Contains toolbar settings.

Namespace: DevExpress.Web.Mvc

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

NuGet Package: DevExpress.Web.Mvc5

Declaration

public GanttToolbarSettings SettingsToolbar { get; }

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.

Gantt 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.

Gantt Standard Toolbar Item

@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.

Gantt Custom Toolbar Item

@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()
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.

@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.

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