DependencyEdit

Feature that displays a popup containing fields for editing a dependency. Requires the Dependencies feature to be enabled. Double-click a dependency line in the demo below to show the editor.

Dependencies

//<code-header>
fiddle.title = 'Dependencies';
//</code-header>
const scheduler = new Scheduler({
    appendTo : targetElement,

    // makes scheduler as high as it needs to be to fit rows
    autoHeight : true,

    startDate : new Date(2018, 4, 6),
    endDate   : new Date(2018, 4, 13),

    columns : [
        { field : 'name', text : 'Name', width : 100 }
    ],

    resources : [
        { id : 1, name : 'Bernard' },
        { id : 2, name : 'Bianca' }
    ],

    events : [
        { id : 1, resourceId : 1, name : 'Interview', startDate : '2018-05-06', endDate : '2018-05-07' },
        { id : 2, resourceId : 1, name : 'Press meeting', startDate : '2018-05-08', endDate : '2018-05-09' },
        { id : 3, resourceId : 2, name : 'Audition', startDate : '2018-05-07', endDate : '2018-05-09' },
        { id : 4, resourceId : 2, name : 'Script deadline', startDate : '2018-05-11', endDate : '2018-05-11' }
    ],

    features : {
        dependencies : {
            clickWidth : 15
        },
        dependencyMenu : true,
        dependencyEdit : {
            editorConfig : {
                items : {
                    // Custom label for the type field
                    typeField : {
                        label : 'Kind'
                    }
                },

                bbar : {
                    items : {
                        // Hiding save button
                        saveButton : {
                            hidden : true
                        }
                    }
                }
            }
        }
    },

    dependencies : [
        { id : 1, from : 1, to : 2, cls : 'dev-path' },
        { id : 2, from : 2, to : 4 }
    ]
});

Customizing the built-in widgets

 const scheduler = new Scheduler({
     columns : [
         { field : 'name', text : 'Name', width : 100 }
     ],
     features : {
         dependencies   : true,
         dependencyEdit : {
             editorConfig : {
                 items : {
                     // Custom label for the type field
                     typeField : {
                         label : 'Kind'
                     }
                 },

                 bbar : {
                     items : {
                         // Hiding save button
                         saveButton : {
                             hidden : true
                         }
                     }
                 }
             }
         }
     }
 });

Built-in widgets

Widget ref	Type	Weight	Description
`fromNameField`	DisplayField	100	From task name (readonly)
`toNameField`	DisplayField	200	To task name (readonly)
`typeField`	Combo	300	Edit type
`lagField`	DurationField	400	Edit lag

The built-in buttons are:

Widget ref	Type	Weight	Description
`saveButton`	Button	100	Save button on the bbar
`deleteButton`	Button	200	Delete button on the bbar
`cancelButton`	Button	300	Cancel editing button on the bbar

This feature is disabled by default. For info on enabling it, see GridFeatures.

Configs

Common

disabledInstancePlugin

listenersEvents

Editor

autoClose: Boolean= true

True to hide this editor if a click is detected outside it (defaults to true)

editorConfig: PopupConfig

Default editor configuration, used to configure the Popup.

saveAndCloseOnEnter: Boolean= true

True to save and close this panel if ENTER is pressed in one of the input fields inside the panel.

triggerEvent: String= dependencydblclickAlso a property

The event that shall trigger showing the editor. Defaults to dependencydblclick, set to empty string or null to disable editing of dependencies.

Editor widgets

showDeleteButton: Boolean= true

True to show a delete button in the form.

showLagField: Boolean= false

True to show the lag field for the dependency

Misc

bubbleEventsEvents

callOnFunctionsEvents

clientInstancePlugin

localeClassLocalizable

localizableLocalizable

localizablePropertiesLocalizable

Other

catchEventHandlerExceptionsEvents

Properties

Common

disabledInstancePlugin

Class hierarchy

isDependencyEdit: Boolean= truereadonly

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

isDependencyEdit: Boolean= truereadonlystatic

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

isEventsEvents

isInstancePluginInstancePlugin

isLocalizableLocalizable

Editor

triggerEvent: String= dependencydblclickAlso a config

The event that shall trigger showing the editor. Defaults to dependencydblclick, set to empty string or null to disable editing of dependencies.

Other

cancelButton: Buttonreadonly

Reference to the cancel button, if used

deleteButton: Buttonreadonly

Reference to the delete button, if used

fromNameField: DisplayFieldreadonly

Reference to the source task name field

lagField: DurationFieldreadonly

Reference to the lag field

saveButton: Buttonreadonly

Reference to the save button, if used

toNameField: DisplayFieldreadonly

Reference to the target task name field

typeField: Comboreadonly

Reference to the dependency type field

catchEventHandlerExceptionsEvents

Lifecycle

configBase

isConstructingBase

isDestroyedBase

isDestroyingBase

Misc

callOnFunctionsEvents

clientInstancePlugin

localeHelperLocalizable

localeManagerLocalizable

Functions

Other

editDependency

Opens a popup to edit the passed dependency.

Parameter	Type	Description
`dependencyRecord`	DependencyModel	The dependency to edit

Returns: Promise -

A Promise that yields true after the editor is shown or false if some application logic vetoed the editing (see beforeDependencyEdit in the docs).

onAfterSave

Template method, intended to be overridden. Called after the dependency record has been updated.

Parameter	Type	Description
`dependencyRecord`	DependencyModel	The dependency record

onBeforeSave

Template method, intended to be overridden. Called before the dependency record has been updated.

Parameter	Type	Description
`dependencyRecord`	DependencyModel	The dependency record

addListenerEvents

hasListenerEvents

LstaticLocalizable

onEvents

relayAllEvents

removeAllListenersEvents

removeListenerEvents

resumeEventsEvents

suspendEventsEvents

triggerEvents

unEvents

destroystaticBase

doDestroyBase

setConfigBase

Misc

animatePropertyBase

callbackBase

doDisableInstancePlugin

downloadTestCaseBase

initClassstaticBase

isOfTypeNamestaticBase

mixinstaticBase

optionalLstaticLocalizable

resolveCallbackBase

updateLocalizationLocalizable

Events

afterDependencySave

Fires on the owning Scheduler or Gantt widget after a dependency is successfully saved using the dependency edit popup

// Adding a listener using the "on" method
dependencyEdit.on('afterDependencySave', ({ source, dependencyRecord }) => {

});

Parameter	Type	Description
`source`	Scheduler	The scheduler instance or Gantt instance
`dependencyRecord`	DependencyModel	The dependency about to be saved

beforeDependencyAdd

Fires on the owning Scheduler or Gantt widget before a dependency is added from the dependency edit popup

// Adding a listener using the "on" method
dependencyEdit.on('beforeDependencyAdd', ({ source, dependencyEdit, dependencyRecord }) => {

});

Parameter	Type	Description
`source`	Scheduler	The scheduler or Gantt instance
`dependencyEdit`	DependencyEdit	The dependency edit feature
`dependencyRecord`	DependencyModel	The dependency about to be added

beforeDependencyDelete

Fires on the owning Scheduler or Gantt widget before a dependency is deleted from the dependency edit popup, or when clicking the delete icon on a selected dependency line.

// Adding a listener using the "on" method
dependencyEdit.on('beforeDependencyDelete', ({ source, dependencyRecord }) => {

});

Parameter	Type	Description
`source`	Scheduler	The scheduler instance
`dependencyRecord`	DependencyModel	The dependency record about to be deleted

beforeDependencyEdit

Fires on the owning Scheduler or Gantt widget before an dependency is displayed in the editor. This may be listened for to allow an application to take over dependency editing duties. Return false to stop the default editing UI from being shown or a Promise yielding true or false for async vetoing.

// Adding a listener using the "on" method
dependencyEdit.on('beforeDependencyEdit', ({ source, dependencyEdit, dependencyRecord }) => {

});

Parameter	Type	Description
`source`	Scheduler	The scheduler or Gantt instance
`dependencyEdit`	DependencyEdit	The dependencyEdit feature
`dependencyRecord`	DependencyModel	The record about to be shown in the editor.

beforeDependencyEditShow

Fires on the owning Scheduler or Gantt widget when the editor for a dependency is available, but before it is shown. Allows manipulating fields before the widget is shown.

// Adding a listener using the "on" method
dependencyEdit.on('beforeDependencyEditShow', ({ source, dependencyEdit, dependencyRecord, editor }) => {

});

Parameter	Type	Description
`source`	Scheduler	The scheduler or Gantt instance
`dependencyEdit`	DependencyEdit	The dependencyEdit feature
`dependencyRecord`	DependencyModel	The record about to be shown in the editor.
`editor`	Popup	The editor popup

beforeDependencySave

Fires on the owning Scheduler or Gantt widget before a dependency is saved using the dependency edit popup

// Adding a listener using the "on" method
dependencyEdit.on('beforeDependencySave', ({ source, dependencyRecord, values }) => {

});

Parameter	Type	Description
`source`	Scheduler	The scheduler or Gantt instance
`dependencyRecord`	DependencyModel	The dependency about to be saved
`values`	Object	The new values

beforeDestroyEvents

catchAllEvents

destroyEvents

disableInstancePlugin

enableInstancePlugin

Event handlers

onAfterDependencySave

Called on the owning Scheduler or Gantt widget after a dependency is successfully saved using the dependency edit popup

new DependencyEdit({
    onAfterDependencySave({ source, dependencyRecord }) {

    }
});

Parameter	Type	Description
`source`	Scheduler	The scheduler instance or Gantt instance
`dependencyRecord`	DependencyModel	The dependency about to be saved

onBeforeDependencyAdd

Called on the owning Scheduler or Gantt widget before a dependency is added from the dependency edit popup

new DependencyEdit({
    onBeforeDependencyAdd({ source, dependencyEdit, dependencyRecord }) {

    }
});

Parameter	Type	Description
`source`	Scheduler	The scheduler or Gantt instance
`dependencyEdit`	DependencyEdit	The dependency edit feature
`dependencyRecord`	DependencyModel	The dependency about to be added

onBeforeDependencyDelete

Called on the owning Scheduler or Gantt widget before a dependency is deleted from the dependency edit popup, or when clicking the delete icon on a selected dependency line.

new DependencyEdit({
    onBeforeDependencyDelete({ source, dependencyRecord }) {

    }
});

Parameter	Type	Description
`source`	Scheduler	The scheduler instance
`dependencyRecord`	DependencyModel	The dependency record about to be deleted

onBeforeDependencyEdit

Called on the owning Scheduler or Gantt widget before an dependency is displayed in the editor. This may be listened for to allow an application to take over dependency editing duties. Return false to stop the default editing UI from being shown or a Promise yielding true or false for async vetoing.

new DependencyEdit({
    onBeforeDependencyEdit({ source, dependencyEdit, dependencyRecord }) {

    }
});

Parameter	Type	Description
`source`	Scheduler	The scheduler or Gantt instance
`dependencyEdit`	DependencyEdit	The dependencyEdit feature
`dependencyRecord`	DependencyModel	The record about to be shown in the editor.

onBeforeDependencyEditShow

Called on the owning Scheduler or Gantt widget when the editor for a dependency is available, but before it is shown. Allows manipulating fields before the widget is shown.

new DependencyEdit({
    onBeforeDependencyEditShow({ source, dependencyEdit, dependencyRecord, editor }) {

    }
});

Parameter	Type	Description
`source`	Scheduler	The scheduler or Gantt instance
`dependencyEdit`	DependencyEdit	The dependencyEdit feature
`dependencyRecord`	DependencyModel	The record about to be shown in the editor.
`editor`	Popup	The editor popup

onBeforeDependencySave

Called on the owning Scheduler or Gantt widget before a dependency is saved using the dependency edit popup

new DependencyEdit({
    onBeforeDependencySave({ source, dependencyRecord, values }) {

    }
});

Parameter	Type	Description
`source`	Scheduler	The scheduler or Gantt instance
`dependencyRecord`	DependencyModel	The dependency about to be saved
`values`	Object	The new values

onBeforeDestroyEvents

onCatchAllEvents

onDestroyEvents

onDisableInstancePlugin

onEnableInstancePlugin

Typedefs

BryntumListenerConfigEvents

DependencyEdit

Customizing the built-in widgets

Built-in widgets

Configs

Common

Editor

Editor widgets

Misc

Other

Properties

Common

Class hierarchy

Editor

Other

Lifecycle

Misc

Functions

Other

Configuration

Events

Lifecycle

Misc

Events

Event handlers

Typedefs