Cancel Incident UI Action with Confirmation Dialog Not Saving State
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
2 hours ago
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);
}
}
- Labels:
-
Incident Management
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
2 hours ago
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
- User clicks Cancel Incident UI Action.
- Client script checks Additional comments.
- If empty → alert, stop.
- If filled → open UI Page dialog.
- User clicks Yes → callback sets state values and submits via gsftSubmit.
- Server-side UI Action updates the record to Canceled.
- 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.
