ColumnDrag

Fires on the owning TaskBoard before column dragging starts. Return false to prevent the action

Fires on the owning TaskBoard when dropping a column, before the operation completes. Handles async listeners, returning false from one will abort the operation

const taskBoard = new TaskBoard({
   listeners : {
       async beforeColumnDrop({ columnRecord, beforeColumn }) {
           // Show confirmation dialog
           const result = await MessageDialog.confirm({
               title   : 'Verify drop',
               message : `Please confirm moving ${columnRecord.text} before ${beforeColumn.text}?`
           });

           // Returning false will abort the drop (if user pressed Cancel)
           return result === MessageDialog.okButton;
       }
   }
});

Fires on the owning TaskBoard when a column is dragged, if the drag leads to a change compared to the last columnDrag event.

Returning false from a listener will flag the drag as invalid (by default turning the drop indicator red)

const taskBoard = new TaskBoard({
   listeners : {
       // Do not allow moving beyond last column
       columnDrag({ columnRecord, beforeColumn }) {
          return beforeColumn === null;
       }
   }
});

Fires on the owning TaskBoard when a drag operation is aborted (invalid drop or aborted using ESC)

Fires on the owning TaskBoard when a previously started drag operation ends, no matter the outcome of it (whether valid, invalid or aborted)

Fires on the owning TaskBoard when column dragging starts

Fires on the owning TaskBoard when a column is successfully dropped (after the drop transition has finished)

Called on the owning TaskBoard before column dragging starts. Return false to prevent the action

Called on the owning TaskBoard when dropping a column, before the operation completes. Handles async listeners, returning false from one will abort the operation

const taskBoard = new TaskBoard({
   listeners : {
       async beforeColumnDrop({ columnRecord, beforeColumn }) {
           // Show confirmation dialog
           const result = await MessageDialog.confirm({
               title   : 'Verify drop',
               message : `Please confirm moving ${columnRecord.text} before ${beforeColumn.text}?`
           });

           // Returning false will abort the drop (if user pressed Cancel)
           return result === MessageDialog.okButton;
       }
   }
});

Called on the owning TaskBoard when a column is dragged, if the drag leads to a change compared to the last columnDrag event.

Returning false from a listener will flag the drag as invalid (by default turning the drop indicator red)

const taskBoard = new TaskBoard({
   listeners : {
       // Do not allow moving beyond last column
       columnDrag({ columnRecord, beforeColumn }) {
          return beforeColumn === null;
       }
   }
});

Called on the owning TaskBoard when a drag operation is aborted (invalid drop or aborted using ESC)

Called on the owning TaskBoard when a previously started drag operation ends, no matter the outcome of it (whether valid, invalid or aborted)

Called on the owning TaskBoard when column dragging starts

Called on the owning TaskBoard when a column is successfully dropped (after the drop transition has finished)