AllocationCellEdit

Adding this feature to the resource utilization view enables assignment effort data editing.

Allocation cell edit

// <code-header>
fiddle.title = 'Allocation cell edit';
// This example uses Scheduler Pro TimePhasedProjectModel class
// which is named SchedulerProTimePhasedProjectModel in the Gantt distribution
TimePhasedProjectModel = typeof SchedulerProTimePhasedProjectModel !== 'undefined' ? SchedulerProTimePhasedProjectModel : TimePhasedProjectModel;
targetElement.innerHTML = '<p>Double click an event row effort value to edit it. Use <kbd>F2</kbd> or <kbd>ENTER</kbd> to complete the editing and <kbd>ESC</kbd> to reject changes:</p>';
// </code-header>

const resourceUtilization = new ResourceUtilization({
    project : new TimePhasedProjectModel({
        loadUrl  : 'data/SchedulerPro/examples/view/ResourceUtilization.json',
        autoLoad : true
    }),
    columns : [
        {
            type  : 'tree',
            text  : 'Name',
            field : 'name',
            width : 170,
            renderer({ record, value }) {
                return record.generatedParent ? record.key.name : value;
            }
        }
    ],
    // the view should not be readOnly to allow editing
    readOnly : false,
    features : {
        // Allow effort values editing
        allocationCellEdit : true,
        scheduleContext    : {
            // allow navigating the time axis cells w/ keyboard
            keyNavigation : true
        },
        treeGroup : {
            // group by resource
            levels : [
                // group by resource
                ({ origin }) => {
                    // origin could be an array of time-phased assignments
                    origin = origin[0] || origin;

                    return origin.resource;
                }
            ]
        }
    },
    startDate  : new Date(2020, 3, 26),
    endDate    : new Date(2020, 4, 15),
    appendTo   : targetElement,
    rowHeight  : 40,
    tickSize   : 40,
    minHeight  : '20em',
    // display tooltip
    showBarTip : true
});

Start editing

In order to start editing effort, one can double click it or press ENTER or F2 key when the corresponding cell is selected, or just start typing a number if autoEdit is enabled (which it is by default).

new ResourceUtilization({
   ...
   features : {
       // allow effort editing
       allocationCellEdit : true,
       ...
   },
   ...
});

Finish editing

Editing can be cancelled by pressing ESC key, which will reject the change. In order to complete the edit and apply the change press F2 key or just click outside the editor.

Keyboard shortcuts

While not editing

Keys	Action
`Enter`	Starts editing currently focused cell
`F2`	Starts editing currently focused cell

While editing

Keys	Action
`Enter`	Finish editing and start editing the same cell in next row
`Shift`+`Enter`	Finish editing and start editing the same cell in previous row
`F2`	Finish editing
`Escape`	Cancel editing without applying changes
`Tab`	Finish editing and start editing the next cell in the same row
`Shift`+`Tab`	Finish editing and start editing the previous cell in the same row

This feature is disabled by default.

Configs

Common

disabledInstancePlugin

listenersEvents

Other

autoEdit: Boolean= trueAlso a property

Set to true to start editing when user starts typing a number on a focused allocation cell

editor: EditorConfig

The embedded editor configuration.

forceTickDatesUsage: Boolean

Provide true to always use the edited ticks start and end dates. If false (default) the feature will use the edited assignment start date when editing the very first tick of the assignment and respectively the assignment end date when editing the last ticks).

catchEventHandlerExceptionsEvents