ScrollButtons

This feature injects buttons in each row that scrolls the task bar into view. It can optionally show a label along with the button, using the labelRenderer.

new Gantt({
    appendTo          : 'container',
    features : {
        scrollButtons : {
            labelRenderer({ taskRecord }) {
                return `${taskRecord.wbsCode} ${StringHelper.encodeHtml(taskRecord.name)}`;
            }
        }
    }

This feature is disabled by default.

Scroll buttons
//<code-header>
fiddle.title = 'Scroll buttons';
//</code-header>
const gantt = new Gantt({
    appendTo  : targetElement,
    height    : 350,
    startDate : '2023-01-01',
    endDate   : '2024-01-01',
    tickSize  : 30,
    features  : {
        scrollButtons : true,
        projectLines  : false
    },
    project : {
        startDate : '2023-01-08',
        duration  : 30,
        events    : [
            {
                id        : 1,
                name      : 'Project A',
                startDate : '2023-01-01',
                duration  : 30,
                expanded  : true,
                children  : [
                    {
                        id                : 11,
                        name              : 'Early task',
                        startDate         : '2023-01-08',
                        duration          : 1,
                        leaf              : true,
                        manuallyScheduled : true
                    },
                    {
                        id        : 12,
                        name      : 'Early task #2',
                        startDate : '2023-01-08',
                        duration  : 1,
                        leaf      : true
                    },
                    {
                        id                : 13,
                        name              : 'Late task',
                        startDate         : '2023-07-08',
                        duration          : 3,
                        leaf              : true,
                        manuallyScheduled : true
                    },
                    {
                        id                : 14,
                        name              : 'Really late task',
                        duration          : 0,
                        startDate         : '2023-11-08',
                        leaf              : true,
                        manuallyScheduled : true
                    }
                ]
            }
        ],
        dependencies : [{
            id        : 1,
            lag       : 1,
            fromEvent : 11,
            toEvent   : 12
        },
        {
            id        : 2,
            lag       : 1,
            fromEvent : 12,
            toEvent   : 13
        }]
    }
});

Configs

13

Common

disabledInstancePlugin
listenersEvents

Misc

bubbleEventsEvents
callOnFunctionsEvents
clientInstancePlugin
localeClassLocalizable
localizableLocalizable
localizablePropertiesLocalizable

Other

backwardIconClsScrollButtons
catchEventHandlerExceptionsEvents
forwardIconClsScrollButtons
labelRendererScrollButtons
scrollOptionsScrollButtons

Properties

15

Common

disabledInstancePlugin

Class hierarchy

isScrollButtons: Boolean= truereadonly
Identifies an object as an instance of ScrollButtons class, or subclass thereof.
isScrollButtons: Boolean= truereadonlystatic
Identifies an object as an instance of ScrollButtons class, or subclass thereof.
isEventsEvents
isInstancePluginInstancePlugin
isLocalizableLocalizable

Lifecycle

configBase
isConstructingBase
isDestroyedBase
isDestroyingBase

Misc

callOnFunctionsEvents
clientInstancePlugin
localeHelperLocalizable
localeManagerLocalizable

Other

catchEventHandlerExceptionsEvents

Functions

28

Configuration

applyDefaultsstaticBase

Events

detachListenersBase

Lifecycle

constructBase
constructorBase
destroystaticBase
doDestroyBase
setConfigBase

Misc

animatePropertyBase
callbackBase
doDisableInstancePlugin
downloadTestCaseBase
initClassstaticBase
isOfTypeNamestaticBase
mixinstaticBase
optionalLstaticLocalizable
resolveCallbackBase
updateLocalizationLocalizable

Other

addListenerEvents
hasListenerEvents
LstaticLocalizable
onEvents
relayAllEvents
removeAllListenersEvents
removeListenerEvents
resumeEventsEvents
suspendEventsEvents
triggerEvents
unEvents

Events

6
scrollButtonClick

Fires on owner when the scroll button is clicked, return false to prevent default scroll behavior

// Adding a listener using the "on" method
scrollButtons.on('scrollButtonClick', ({ domEvent, taskRecord }) => {

});
ParameterTypeDescription
domEventEvent

DOM event

taskRecordTaskModel

The task record

beforeDestroyEvents
catchAllEvents
destroyEvents
disableInstancePlugin
enableInstancePlugin

Event handlers

6
onScrollButtonClick

Called on owner when the scroll button is clicked, return false to prevent default scroll behavior

new ScrollButtons({
    onScrollButtonClick({ domEvent, taskRecord }) {

    }
});
ParameterTypeDescription
domEventEvent

DOM event

taskRecordTaskModel

The task record

onBeforeDestroyEvents
onCatchAllEvents
onDestroyEvents
onDisableInstancePlugin
onEnableInstancePlugin

Typedefs

1

CSS variables

6

Inherited

ScrollButtons6