Remove drag and drop for kanban board

kchadwick
Tera Expert

How can the drag and drop functionality for the kanban board be disabled? There are several problems with allowing users to simply drag and drop tasks. Creating business rules and data policies is becoming too difficult to manage for locking down this board without affecting OOB functionality.

 

For example, right now users can drag and drop approval tasks in future phases into open to get approvals faster when they havent completed an earlier phase. However, if you try to block this when you cancel a release the tasks wont cancel due to teh same policy. Trying to balance all of these different rules would be easier to just turn off drag and drop on the kanban board.

1 ACCEPTED SOLUTION

Sai Teja1
ServiceNow Employee

Hi @kchadwick 

 

You could disable the drag and drop by navigating to the UI Builder page for Release Execution.

 

UIB Page: {instance}/now/builder/ui/edit/experience/fe72c9ef43012110509fb18afab8f2b6/8699e66f43e2211092fef6be5bb8f2ca/8e99e66f43e2211092fef6be5bb8f2a3/params/is-headless-viewport/true/parent-screen-id/44c7e2a743e2211092fef6be5bb8f288/parent-element-id/viewport_vyr

 

Steps: Click on 'Task kanban board' component from the left content tree and then disable the 'Card drag and drop option' property on the right side. Check the attached screenshot for reference.

 

View solution in original post

4 REPLIES 4

Itallo Brandão
Tera Guru

Hi @kchadwick ,

I completely understand your frustration. Balancing "Strict Process Control" with "User Experience" in VTBs can be tricky.

The Short Answer: There is no simple system property or checkbox to disable "Drag and Drop" functionality on a Data-Driven Kanban board while keeping the underlying field editable in the Form view. The VTB logic is tied directly to the user's Write ACL on the lane field (e.g., State). If they can edit the State on the form, they can technically drag the card.

The Solution (Fixing the Business Rule Conflict): You mentioned that Data Policies are breaking your "Cancel Release" automation. The issue isn't the drag-and-drop itself, but rather that your validation logic is too broad.

Instead of trying to disable the UI, you should refine your Business Rule to act as a smart "Traffic Cop". You need a rule that blocks the illegal move (Future -> Open) but explicitly allows the system action (Cancel).

Here is a logic template that solves your "Cancel" issue while locking down the board:

Business Rule Configuration:

  • Table: [Your Task Table]

  • When: Before Update

  • Condition: State changes

Script:

(function executeRule(current, previous /*null when async*/) {

    // 1. THE EXIT DOOR: Always allow moving to 'Cancelled'
    // This ensures your "Cancel Release" button/automation NEVER gets blocked.
    // Replace '4' or '7' with your actual Cancelled value/constant
    if (current.state == '7' || current.state == '4') {
        return; 
    }

    // 2. THE GUARD RAIL: Block specific illegal moves (Drag & Drop prevention)
    // Example: Blocking Future (-1) to Open (1)
    if (previous.state == '-1' && current.state == '1') {
        
        // Optional: Only block if it's an interactive user session (manual drag)
        if (gs.isInteractive()) {
            gs.addErrorMessage('You cannot skip phases by dragging tasks. Please follow the process.');
            current.setAbortAction(true);
        }
    }

})(current, previous);

Why this works: By placing the "Cancelled check" at the very top, you ensure that no matter what restriction you add later for the users, the system's ability to kill a task is preserved. This removes the maintenance headache you described.

Summary: You cannot simply "turn off" VTB drag-and-drop without making the field Read-Only via ACLs. The best path is a robust onBefore Business Rule that allows exceptions for your automation.

If this helps you secure the process without breaking the automation, please mark it as Accepted Solution.

Best regards,
Brandão.

This is what I was currently doing but it was getting too robust and hard to manage. This is the best option for people who don't want to edit the UI builder but I am going to accept the workspace UI solution suggested by Sai Teja1. 

Sai Teja1
ServiceNow Employee

Hi @kchadwick 

 

You could disable the drag and drop by navigating to the UI Builder page for Release Execution.

 

UIB Page: {instance}/now/builder/ui/edit/experience/fe72c9ef43012110509fb18afab8f2b6/8699e66f43e2211092fef6be5bb8f2ca/8e99e66f43e2211092fef6be5bb8f2a3/params/is-headless-viewport/true/parent-screen-id/44c7e2a743e2211092fef6be5bb8f288/parent-element-id/viewport_vyr

 

Steps: Click on 'Task kanban board' component from the left content tree and then disable the 'Card drag and drop option' property on the right side. Check the attached screenshot for reference.

 

Itallo Brandão
Tera Guru

Hi @kchadwick ,

You are absolutely right to point out the context!

Since the original post didn't specify whether you were using the Classic Visual Task Boards or the modern Workspace (UI Builder), we ended up providing solutions for both eras of ServiceNow.

  • Scenario A (Workspace/UI Builder): As @Sai Teja1  correctly identified, if you are in the Digital Product Release Workspace, the checkbox in UI Builder is the native and easiest way to turn this off. Definitely use his solution for the UI!

  • Scenario B (Classic UI/Data Integrity): My suggestion regarding the Business Rule is still relevant as a "Backend Safety Net". Disabling the drag-and-drop in the UI prevents the visual action, but users could still potentially change the state via the List View or Form View. The Business Rule prevents the illegal transition regardless of where the user attempts it.


Recommendation:
Please apply Sai's solution to fix the UI experience immediately. If you find users are still bypassing the process via List Edits, consider implementing the Business Rule logic I shared as a secondary enforcement.

 

Best regards, Brandão.