How to Implement a Confirmation Dialog Box using Client Scripts in ServiceNow

ServiceNow developers often encounter scenarios where users need confirmation before proceeding with certain actions. A common use case involves ensuring that specific date fields, such as "planned start" and "actual start" on a change request, meet defined business rules. Implementing a confirmation dialog can significantly improve data accuracy and user experience by prompting users to confirm critical choices or avoid mistakes before submitting.

In this article, we will cover how to effectively implement a confirmation box using ServiceNow client scripts, addressing common issues, and providing a clear, step-by-step solution.

Understanding the Issue

A common requirement is to ensure the actual start date of a change request isn't earlier than the planned start date. Developers attempting this may initially use an onChange client script with JavaScript's native confirm() method. However, developers often find that even after the user selects 'Yes' to continue, the form submission or action may not proceed as expected.

Here's an example scenario: if the actual start date entered by a user is earlier than the planned start date, a confirmation popup appears stating, "Change request cannot be implemented before planned start time begins." If the user chooses to continue (clicking 'Yes'), the form should proceed with saving; otherwise, it should halt.

Step-by-Step Solution

To effectively implement this logic, an onSubmit client script should be used instead of an onChange script, as it gives precise control over whether the form submission proceeds or is canceled.

Follow these steps to implement a proper confirmation box:

Step 1: Creating an onSubmit Client Script

1. Navigate to System Definition > Client Scripts.

2. Click on "New" to create a new client script.

3. Select the table for your change request (typically change_request).

4. Set the Type to onSubmit.

   
   

Step 2: Implementing the Client Script Logic

Here's a verified script example:

function onSubmit() {
    var plannedStart = g_form.getValue("start_date");
    var actualStart = g_form.getValue("work_start");

    if (!plannedStart || !actualStart)
        return true; // No dates to compare, proceed normally

    var dateFormat = g_user_date_time_format;
    var plannedStartMs = getDateFromFormat(plannedStart, dateFormat);
    var actualStartMs = getDateFromFormat(actualStart, dateFormat);

    if (actualStartMs < plannedStartMs) {
        var userResponse = confirm("Change request cannot be implemented  	  before the planned start time begins. Click OK to continue anyway or Cancel to stop.");

        if (!userResponse) {
            // User selected Cancel, abort submission
            return false;
        }
    }
    return true; // Proceed with submission
}

Explanation and Best Practices

• Why use onSubmit instead of onChange?

An onChange script runs whenever a specified field value changes, making it unsuitable for decisions about submission. In contrast, onSubmit allows confirmation dialogs precisely at the point of saving, which is ideal for validating conditions and preventing undesired submissions.

• Handling Date Formats Correctly

Always use ServiceNow's built-in function getDateFromFormat to compare dates reliably, ensuring the script accurately considers users' regional settings.

• User-Friendly Messaging

Clearly phrase your confirmation message, explicitly informing the user what action will occur if they click OK or Cancel.

Alternative Approach

While the native JavaScript confirm() method works well, you could also use ServiceNow's built-in AJAX capabilities to implement more complex interactions, such as additional server-side validations or fetching supplementary data during form submission.

For advanced use cases, consider exploring AJAX client scripts or UI policies to enhance user interactions further.

Conclusion

Implementing confirmation dialogs in ServiceNow via client scripts ensures users are consciously validating critical business rules, such as date comparisons. Using an onSubmit client script with the built-in confirm() method allows developers to create intuitive interactions, maintaining data integrity and preventing incorrect submissions.

Always verify that your scripts are user-friendly, functionally accurate, and robust across different user scenarios.

Now, it's your turn—enhance your ServiceNow forms by implementing this approach in your next client script!