TaskDragSelect

Enables users to click and drag to select cards on the TaskBoard (marquee selection).

Task drag select
//<code-header>
fiddle.title = 'Task drag select';
//</code-header>
const taskBoard = new TaskBoard({
    appendTo : targetElement,

    features : {
        taskDrag       : true,
        taskDragSelect : true,
        columnToolbars : false
    },

    // Url for resource avatar images
    resourceImagePath : 'data/Grid/images/transparent-users/',

    // Columns to display
    columns : [
        'todo',
        'doing',
        'done'
    ],

    // Field used to pair a task to a column
    columnField : 'status',

    // Project using inline data
    project : {
        tasks : [
            { id : 1, name : 'Try TaskBoard', status : 'doing' },
            { id : 2, name : 'Test Scheduler', status : 'done' },
            { id : 3, name : 'Evaluate Gantt', status : 'doing' },
            { id : 4, name : 'Download Grid', status : 'todo' },
            { id : 5, name : 'Install Scheduler Pro', status : 'todo' }
        ],

        resources : [
            { id : 1, name : 'Angelo', image : 'angelo.png' },
            { id : 2, name : 'Celia', image : 'celia.png' },
            { id : 3, name : 'Dave', image : 'dave.png' },
            { id : 4, name : 'Emilia', image : 'emilia.png' }
        ],

        assignments : [
            { id : 1, event : 1, resource : 1 },
            { id : 2, event : 2, resource : 2 },
            { id : 3, event : 3, resource : 3 },
            { id : 4, event : 4, resource : 4 },
            { id : 5, event : 5, resource : 1 },
            { id : 6, event : 1, resource : 2 },
            { id : 7, event : 2, resource : 3 },
            { id : 29, event : 3, resource : 1 }
        ]
    }
});

This feature is enabled by default.

Configs

10

Common

disabledInstancePlugin
listenersEvents

Other

dragThreshold: Number= 5

The amount of pixels to move pointer/mouse before it counts as a drag select operation.

const taskBoard = new TaskBoard({
   features : {
       taskDragSelect : {
           dragThreshold : 10
       }
   }
});

Misc

clientInstancePlugin
localeClassLocalizable
localizableLocalizable

Properties

15

Common

disabledInstancePlugin

Class hierarchy

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

Lifecycle

configBase

Misc

clientInstancePlugin
localeHelperLocalizable
localeManagerLocalizable

Other

Functions

28

Configuration

applyDefaultsstaticBase

Events

Lifecycle

destroystaticBase

Misc

doDisableInstancePlugin
initClassstaticBase
isOfTypeNamestaticBase
mixinstaticBase
optionalLstaticLocalizable

Other

LstaticLocalizable
onEvents
relayAllEvents
triggerEvents
unEvents

Events

5
catchAllEvents
destroyEvents
disableInstancePlugin
enableInstancePlugin

Event handlers

5
onDestroyEvents
onDisableInstancePlugin
onEnableInstancePlugin

Typedefs

1

CSS variables

2
NameDescription
--b-task-board-drag-select-borderMarquee border
--b-task-board-drag-select-border-radiusMarquee border radius