Disable Column Reordering in TaskBoard

Updated on Dec 19, 2025

Environment

Product Version	8.3.0
Product	Progress® KendoReact TaskBoard

Description

In a TaskBoard component for React, it might be necessary to prevent users from reordering the columns.

This KB article also answers the following questions:

• How can I disable dragging of columns in the TaskBoard for React?
• Is it possible to lock the column order in the React TaskBoard?
• How do I stop users from rearranging columns in my React TaskBoard?

Solution

To disable column reordering in the TaskBoard for React, apply the CSS property pointer-events: none to the .k-taskboard-column-header class. This approach does not require built-in functionality and can be implemented with a simple CSS tweak.

Include the following CSS rule in your project:

css

.k-taskboard-column-header {
    pointer-events: none;
}

This will prevent mouse events on the column headers, effectively disabling the ability to reorder columns.

Bellow is a demo that displays KendoReact TaskBoard with fixed columns:

Change Theme

Theme

Loading ...

See Also

• TaskBoard Overview - Official documentation for TaskBoard for React.