Cancel Incident UI Action with Confirmation Dialog Not Saving State

Sandeep8987
Tera Contributor

Hello Community,

I’ve created a UI Action and a UI Page to cancel an incident after user confirmation. The requirement are:

  • Validate that Additional comments are filled before canceling.
  • Show a confirmation dialog (Yes/No).
  • If user clicks Yes, set incident_state and state to Canceled  and save the record.
  • If user clicks No, close the dialog without changes
    I have created an UI Page for that.
    Here’s what I have so far:
    for UI action :
     

 

function confirmAndCancel() {
    //Ensure comments are filled
    var comments = g_form.getValue("comments");
    if (!comments) {
        alert('The "Additional comments" field must be filled in before the transtitioning to Canceled');
        return false;
    }

    var dialog = new GlideDialogWindow("incident_confirm_cancel"); // UI Page name
    //alert('tesst');
    dialog.setTitle("Cancel Incident?");
    dialog.setPreference('sys_id', g_form.getUniqueValue());
    dialog.setPreference("callback", function(result) {
        alert("Callback:" + result);
        if (result === "yes") {

            alert('User selected YES');
			g_form.setValue('incident_state','8');
			g_form.setValue('state','8');
			//g_form.save();
			// g_form.submit("cancel_incident");

          gsftSubmit(null, g_form.getFormElement(), "cancel_incident");


        }
        if (result === "no") {
            alert('User selected No');

            return false;
        }
    });
    dialog.render();
    return false;
}

 



For UI page 
HTML:

 

<?xml version="1.0" encoding="utf-8" ?>
<j:jelly trim="false" xmlns:j="jelly:core" xmlns:g="glide" xmlns:j2="null" xmlns:g2="null">

    <div style="text-align:center; padding: 20px;">
        <h3>${gs.getMessage('Cancel Incident?')}</h3>
        <p>${gs.getMessage('Are you sure you want to cancel this incident?')}</p>
		 <button class="btn btn-danger" style="margin-right: 15px;" onclick="sendResponse('yes');"> ${gs. getMessage( 'Yes')}</button>
		  <button class="btn btn-default" onclick="sendResponse('no');"> ${gs. getMessage( 'No')}</button>
    </div>
	


</j:jelly>​

 


Client script:
 

 

function sendResponse(answer){
	var gdw = GlideDialogWindow.get();
	gdw.destroy();

var callback = gdw.getPreference("callback");
if(callback && typeof callback ==="function"){
	callback(answer);
}
}

 

Bhavya11  





1 ACCEPTED SOLUTION

Anupam1
Mega Guru

Hi @Sandeep8987 ,

 

The solution for your Cancel Incident requirement:-

UI Action (client + server), the UI Page (Jelly + client script),

 

1️. UI Action (Client-side script)

This is the button the user clicks. It validates Additional comments, opens the confirmation dialog, and handles the callback.

function confirmAndCancel() {

    // Ensure Additional comments are filled

    var comments = g_form.getValue("comments");

    if (!comments || comments.trim() === "") {

        alert('The "Additional comments" field must be filled in before transitioning to Canceled');

        return false;

    }

 

    // Open confirmation dialog (UI Page)

    var dialog = new GlideDialogWindow("incident_confirm_cancel"); // UI Page name

    dialog.setTitle("Cancel Incident?");

    dialog.setPreference('sys_id', g_form.getUniqueValue());

    dialog.setPreference("callback", function(result) {

        if (result === "yes") {

            // Set values and submit to server-side UI Action

            g_form.setValue('incident_state', '8'); // 8 = Canceled

            g_form.setValue('state', '8');

            gsftSubmit(null, g_form.getFormElement(), "cancel_incident");

        }

        if (result === "no") {

            // Do nothing, just close

            return false;

        }

    });

    dialog.render();

    return false;

}

 Important: In the UI Action record, set Action name = cancel_incident. That ties the client-side gsftSubmit to the server-side script.

 

2️.  UI Action (Server-side script)

This runs when the user confirms cancellation. It updates the record.

// Server-side script for UI Action "cancel_incident"

if (typeof current !== 'undefined') {

    current.state = 8;           // Canceled

    current.incident_state = 8;  // Canceled

    current.update();

}

 

3️.  UI Page (Jelly)

This is the confirmation dialog. It shows Yes/No buttons and calls back to the client.

<?xml version="1.0" encoding="utf-8" ?>

<j:jelly trim="false" xmlns:j="jelly:core" xmlns:g="glide">

 

    <div style="text-align:center; padding: 20px;">

        <h3>${gs.getMessage('Cancel Incident?')}</h3>

        <p>${gs.getMessage('Are you sure you want to cancel this incident?')}</p>

        <button class="btn btn-danger" style="margin-right: 15px;" onclick="sendResponse('yes');">

            ${gs.getMessage('Yes')}

        </button>

        <button class="btn btn-default" onclick="sendResponse('no');">

            ${gs.getMessage('No')}

        </button>

    </div>

 

    <script>

    function sendResponse(answer){

        var gdw = GlideDialogWindow.get();

        gdw.destroy();

        var callback = gdw.getPreference("callback");

        if(callback && typeof callback === "function"){

            callback(answer);

        }

    }

    </script>

</j:jelly>

 

4️.  End-to-End Flow

  1. User clicks Cancel Incident UI Action.
  2. Client script checks Additional comments.
    • If empty → alert, stop.
  3. If filled → open UI Page dialog.
  4. User clicks Yes → callback sets state values and submits via gsftSubmit.
  5. Server-side UI Action updates the record to Canceled.
  6. User clicks No → dialog closes, no changes.

 

If my response helped please mark it correct and close the thread so that it benefits future readers.

 

Best,

Anupam.

View solution in original post

2 REPLIES 2

Anupam1
Mega Guru

Hi @Sandeep8987 ,

 

The solution for your Cancel Incident requirement:-

UI Action (client + server), the UI Page (Jelly + client script),

 

1️. UI Action (Client-side script)

This is the button the user clicks. It validates Additional comments, opens the confirmation dialog, and handles the callback.

function confirmAndCancel() {

    // Ensure Additional comments are filled

    var comments = g_form.getValue("comments");

    if (!comments || comments.trim() === "") {

        alert('The "Additional comments" field must be filled in before transitioning to Canceled');

        return false;

    }

 

    // Open confirmation dialog (UI Page)

    var dialog = new GlideDialogWindow("incident_confirm_cancel"); // UI Page name

    dialog.setTitle("Cancel Incident?");

    dialog.setPreference('sys_id', g_form.getUniqueValue());

    dialog.setPreference("callback", function(result) {

        if (result === "yes") {

            // Set values and submit to server-side UI Action

            g_form.setValue('incident_state', '8'); // 8 = Canceled

            g_form.setValue('state', '8');

            gsftSubmit(null, g_form.getFormElement(), "cancel_incident");

        }

        if (result === "no") {

            // Do nothing, just close

            return false;

        }

    });

    dialog.render();

    return false;

}

 Important: In the UI Action record, set Action name = cancel_incident. That ties the client-side gsftSubmit to the server-side script.

 

2️.  UI Action (Server-side script)

This runs when the user confirms cancellation. It updates the record.

// Server-side script for UI Action "cancel_incident"

if (typeof current !== 'undefined') {

    current.state = 8;           // Canceled

    current.incident_state = 8;  // Canceled

    current.update();

}

 

3️.  UI Page (Jelly)

This is the confirmation dialog. It shows Yes/No buttons and calls back to the client.

<?xml version="1.0" encoding="utf-8" ?>

<j:jelly trim="false" xmlns:j="jelly:core" xmlns:g="glide">

 

    <div style="text-align:center; padding: 20px;">

        <h3>${gs.getMessage('Cancel Incident?')}</h3>

        <p>${gs.getMessage('Are you sure you want to cancel this incident?')}</p>

        <button class="btn btn-danger" style="margin-right: 15px;" onclick="sendResponse('yes');">

            ${gs.getMessage('Yes')}

        </button>

        <button class="btn btn-default" onclick="sendResponse('no');">

            ${gs.getMessage('No')}

        </button>

    </div>

 

    <script>

    function sendResponse(answer){

        var gdw = GlideDialogWindow.get();

        gdw.destroy();

        var callback = gdw.getPreference("callback");

        if(callback && typeof callback === "function"){

            callback(answer);

        }

    }

    </script>

</j:jelly>

 

4️.  End-to-End Flow

  1. User clicks Cancel Incident UI Action.
  2. Client script checks Additional comments.
    • If empty → alert, stop.
  3. If filled → open UI Page dialog.
  4. User clicks Yes → callback sets state values and submits via gsftSubmit.
  5. Server-side UI Action updates the record to Canceled.
  6. User clicks No → dialog closes, no changes.

 

If my response helped please mark it correct and close the thread so that it benefits future readers.

 

Best,

Anupam.

I have tried with this script now It's working fine now :

function confirmAndCancel() {
    //Ensure comments are filled
    var comments = g_form.getValue("comments");
    if (!comments) {
        alert('The "Additional comments" field must be filled in before the transtitioning to Canceled');
        return false;
    }

var dialog = new GlideDialogWindow("incident_confirm_cancel"); // UI Page name
alert('tesst');
dialog.setTitle("Cancel Incident?");
dialog.setPreference('sys_id', g_form.getUniqueValue());
dialog.setPreference("callback", function(result) {
            alert("Callback:" + result);
            if (result === "yes") {

                alert('User selected YES');
                g_form.setValue('incident_state', 8);
                g_form.setValue('state', 8);
			

         gsftSubmit(null, g_form.getFormElement(), "cancel_incident");

        }
        if (result === "no") {
            alert('User selected No');

            return false;
        }
    });
    dialog.render();
    return false;

}
 if (typeof window == 'undefined')
     serverResolve();
 
 function serverResolve() {
        current.state = IncidentState.CANCELED;
        current.incident_state = IncidentState.CANCELED;
        current.update();
        action.setRedirectURL(current);
 }

 Thank you