Hello Community,
In general, when we need to execute both client-side and server-side scripts from a UI Action in ServiceNow, we often use the gsftSubmit() method within the client script of the UI Action. However, this method involves DOM manipulation, which is not recommended in ServiceNow. The reason is that DOM manipulation requires referencing elements in the DOM by their IDs or CSS selectors. When dealing with out-of-box DOM elements, there’s a risk that their IDs or positions within the DOM structure may change, potentially causing the code to fail or generate errors.
To avoid these types of issues, it’s better to explore alternative approaches to execute server-side scripts in a UI Action while still incorporating client-side logic. One such approach is using GlideAjax. Below is an example use case demonstrating this approach:
I created a UI Action named "Create Task" on the Incident form, which is displayed when the incident is in the New state. Upon clicking the button, a confirmation prompt (handled on the client side) is displayed. If the user confirms, the UI Action invokes a Script Include via GlideAjax to create an Incident Task for the current incident.
UI Action:
UI Action Script:
function confirmTaskCreation() {
var takeConfirm = confirm("Are you sure you, want to create task? (this will move state to inprogress) : ");
if (takeConfirm) {
var num = g_form.getValue('number').toString();
var callTask = new GlideAjax('CreateIncTaskUIAction');
callTask.addParam('sysparm_name', 'generateIncTask');
callTask.addParam('sysparm_number', num);
callTask.getXML(createTask);
function createTask(response) {
var num = response.responseXML.documentElement.getAttribute('answer');
g_form.addInfoMessage("Incident Task is created: " + num);
}
}
}
Script Include:
Script Include (script):
var CreateIncTaskUIAction = Class.create();
CreateIncTaskUIAction.prototype = Object.extendsObject(AbstractAjaxProcessor, {
generateIncTask: function(){
var num = this.getParameter('sysparm_number');
var incObj = new GlideRecord('incident');
incObj.addQuery('number',num);
incObj.query();
if(incObj.next()){
incObj.state = 2;
incObj.update();
var incTaskObj = new GlideRecord('incident_task');
incTaskObj.initialize();
incTaskObj.incident = incObj.sys_id;
incTaskObj.short_description = incObj.short_description;
incTaskObj.description = incObj.description;
incTaskObj.priority = incObj.priority;
incTaskObj.insert();
return " Number: "+incTaskObj.number.toString();
}
},
type: 'CreateIncTaskUIAction'
});
This approach looks lengthy, but process-wise compared to DOM manipulation, it is the better approach. Kindly share your thoughts, and suggestions, and share any issues you found in this approach.
Please mark this as Helpful, if you found this article helpful
Thank you very much
Ramana Murthy G
ServiceNow Developer
