TaskResize

Feature that allows resizing a task by dragging its end date. Resizing a task by dragging its start date is not allowed.

This feature is enabled by default

This feature updates the event's endDate live in order to leverage the rendering pathway to always yield a correct appearance. The changes are done in batched mode so that changes do not become eligible for data synchronization or propagation until the operation is completed.

To show custom HTML in the tooltip, please see the tooltipTemplate config. Example:

taskResize : {
    // A minimal end date tooltip
    tooltipTemplate : ({ record, endDate }) => {
        return DateHelper.format(endDate, 'MMM D');
    }
}

Configs

Common

disabledInstancePlugin

listenersEvents

Other

pinSuccessors: Boolean | String= falseAlso a property

Set to true to enable resizing task while pinning dependent tasks. By default, this behavior is activated if you hold CTRL key during drag. Alternatively, you may provide key name to use. Supported values are:

'ctrl'
'shift'
'alt'
'meta'

Note: Only supported in forward-scheduled project

allowResizeToZeroEventResize

bottomHandleEventResize

catchEventHandlerExceptionsEvents

dragThresholdEventResize

dragTouchStartDelayEventResize

dynamicHandleSizeEventResize

leftHandleEventResize

lockLayoutEventResize

reservedSpaceEventResize

resizeSelectedEventResize

rightHandleEventResize

showExactResizePositionEventResize

showTooltipEventResize

tipEventResize

tooltipTemplateEventResize

topHandleEventResize

validatorFnEventResize

validatorFnThisObjEventResize

Misc

bubbleEventsEvents

callOnFunctionsEvents

clientInstancePlugin

localeClassLocalizable

localizableLocalizable

localizablePropertiesLocalizable

Properties

Common

disabledInstancePlugin

Class hierarchy

isTaskResize: Boolean= truereadonly

Identifies an object as an instance of TaskResize class, or subclass thereof.

isTaskResize: Boolean= truereadonlystatic

Identifies an object as an instance of TaskResize class, or subclass thereof.

isEventResizeEventResize

isEventsEvents

isInstancePluginInstancePlugin

isLocalizableLocalizable

Other

pinSuccessors: Boolean | StringAlso a config

Gets or sets special key to activate successor pinning behavior. Supported values are:

'ctrl'
'shift'
'alt'
'meta'

Assign false to disable it.

catchEventHandlerExceptionsEvents

isResizingEventResize

tipEventResize

Lifecycle

configBase

isConstructingBase

isDestroyedBase

isDestroyingBase

Misc

callOnFunctionsEvents

clientInstancePlugin

localeHelperLocalizable

localeManagerLocalizable

Functions

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

beforeTaskResize

Fires on the owning Gantt before resizing starts. Return false to prevent the operation.

// Adding a listener using the "on" method
taskResize.on('beforeTaskResize', ({ taskRecord, event }) => {

});

Parameter	Type	Description
`taskRecord`	TaskModel
`event`	Event

beforeTaskResizeFinalize

Fires on the owning Gantt to allow implementer to prevent immediate finalization by setting data.context.async = true in the listener, to show a confirmation popup etc.

 gantt.on('beforeTaskResizeFinalize', ({context}) => {
     context.async = true;
     setTimeout(() => {
         // async code don't forget to call finalize
         context.finalize();
     }, 1000);
 })

// Adding a listener using the "on" method
taskResize.on('beforeTaskResizeFinalize', ({ taskRecord, source, context, context.endDate, context.originalEndDate, context.resizeData, event, context.async, context.finalize }) => {

});

Parameter	Type	Description
`taskRecord`	TaskModel
`source`	Gantt	Gantt instance
`context`	Object
`context.endDate`	Date	New endDate
`context.originalEndDate`	Date	End date before resize
`context.resizeData`	TaskResizeData[]	Resize data for selected tasks. Only available when resizeSelected is `true`.
`event`	Event	Browser event
`context.async`	Boolean	Set true to handle resize asynchronously (e.g. to wait for user confirmation)
`context.finalize`	function	Call this method to finalize resize. This method accepts one argument: pass true to update records, or false, to ignore changes

taskPartialResize

Fires on the owning Gantt on each resize move event

// Adding a listener using the "on" method
taskResize.on('taskPartialResize', ({ resizeData, taskRecord, startDate, endDate, element }) => {

});

Parameter	Type	Description
`resizeData`	TaskResizeData[]	Data for the tasks that are being resized. Only available when resizeSelected is `true`. The nested properties are same as `context`
`taskRecord`	TaskModel	Task record being resized
`startDate`	Date	New startDate
`endDate`	Date	New endDate
`element`	HTMLElement

taskResizeEnd

Fires on the owning Gantt after the resizing gesture has finished.

// Adding a listener using the "on" method
taskResize.on('taskResizeEnd', ({ changed, taskRecord, resizeData }) => {

});

Parameter	Type	Description
`changed`	Boolean
`taskRecord`	TaskModel
`resizeData`	TaskResizeData[]	Resize data for selected tasks. Only available when resizeSelected is `true`

taskResizeStart

Fires on the owning Gantt when task resizing starts

// Adding a listener using the "on" method
taskResize.on('taskResizeStart', ({ taskRecord, event, resizeData }) => {

});

Parameter	Type	Description
`taskRecord`	TaskModel
`event`	Event
`resizeData`	TaskResizeData[]	Resize data for selected tasks. Only available when resizeSelected is `true`

beforeDestroyEvents

beforeEventResizeEventResize

beforeEventResizeFinalizeEventResize

catchAllEvents

destroyEvents

disableInstancePlugin

enableInstancePlugin

eventPartialResizeEventResize

eventResizeEndEventResize

eventResizeStartEventResize

Event handlers

onBeforeTaskResize

Called on the owning Gantt before resizing starts. Return false to prevent the operation.

new TaskResize({
    onBeforeTaskResize({ taskRecord, event }) {

    }
});

Parameter	Type	Description
`taskRecord`	TaskModel
`event`	Event

onBeforeTaskResizeFinalize

Called on the owning Gantt to allow implementer to prevent immediate finalization by setting data.context.async = true in the listener, to show a confirmation popup etc.

 gantt.on('beforeTaskResizeFinalize', ({context}) => {
     context.async = true;
     setTimeout(() => {
         // async code don't forget to call finalize
         context.finalize();
     }, 1000);
 })

new TaskResize({
    onBeforeTaskResizeFinalize({ taskRecord, source, context, event }) {

    }
});

Parameter	Type	Description
`taskRecord`	TaskModel
`source`	Gantt	Gantt instance
`context`	Object
`context.endDate`	Date	New endDate
`context.originalEndDate`	Date	End date before resize
`context.resizeData`	TaskResizeData[]	Resize data for selected tasks. Only available when resizeSelected is `true`.
`event`	Event	Browser event
`context.async`	Boolean	Set true to handle resize asynchronously (e.g. to wait for user confirmation)
`context.finalize`	function	Call this method to finalize resize. This method accepts one argument: pass true to update records, or false, to ignore changes

onTaskPartialResize

Called on the owning Gantt on each resize move event

new TaskResize({
    onTaskPartialResize({ resizeData, taskRecord, startDate, endDate, element }) {

    }
});

Parameter	Type	Description
`resizeData`	TaskResizeData[]	Data for the tasks that are being resized. Only available when resizeSelected is `true`. The nested properties are same as `context`
`taskRecord`	TaskModel	Task record being resized
`startDate`	Date	New startDate
`endDate`	Date	New endDate
`element`	HTMLElement

onTaskResizeEnd

Called on the owning Gantt after the resizing gesture has finished.

new TaskResize({
    onTaskResizeEnd({ changed, taskRecord, resizeData }) {

    }
});

Parameter	Type	Description
`changed`	Boolean
`taskRecord`	TaskModel
`resizeData`	TaskResizeData[]	Resize data for selected tasks. Only available when resizeSelected is `true`

onTaskResizeStart

Called on the owning Gantt when task resizing starts

new TaskResize({
    onTaskResizeStart({ taskRecord, event, resizeData }) {

    }
});

Parameter	Type	Description
`taskRecord`	TaskModel
`event`	Event
`resizeData`	TaskResizeData[]	Resize data for selected tasks. Only available when resizeSelected is `true`

onBeforeDestroyEvents

onBeforeEventResizeEventResize

onBeforeEventResizeFinalizeEventResize

onCatchAllEvents

onDestroyEvents

onDisableInstancePlugin

onEnableInstancePlugin

onEventPartialResizeEventResize

onEventResizeEndEventResize

onEventResizeStartEventResize

Typedefs

TaskResizeData

An object containing data related to task resize.

Parameter	Type	Description
`taskRecord`	TaskModel	Task record being resized
`startDate`	Date	New startDate (changed if resizing start side)
`endDate`	Date	New endDate (changed if resizing end side)
`originalStartDate`	Date	Start date before resize
`originalEndDate`	Date	End date before resize
`element`	HTMLElement	The task element

BryntumListenerConfigEvents

EventResizeDataEventResize

CSS variables

Inherited

EventResize10

TaskResize

Customizing the resize tooltip

Configs

Common

Other

Misc

Properties

Common

Class hierarchy

Other

Lifecycle

Misc

Functions

Configuration

Events

Lifecycle

Misc

Other

Events

Event handlers

Typedefs

CSS variables

Inherited