UI Actions / page prompting to leave/stay on page

[matt_a]

I have a UI action and page that I am trying to customise based on a category selected.

The ui action sets a field as mandatory and asks the user to complete. When ui action pressed again, it calls a dialog box to add comments.

I have read through: https://www.servicenowguru.com/system-ui/ui-actions-system-ui/client-server-code-ui-action/

but as it uses the dialog, I need the client side of the ui page to submit the changes made to the new mandatory field on the form. However, when pressing ok on the dialog, it prompts me to leave page so the changes made are not saved.

The client script on the ui page is as follows:

function submitCancel() {
	$("button_clicked").value = 'cancel';
	$("hr_comment").value = '';
	GlideDialogWindow.get().destroy();
	return false;
}

function submitOk() {

	
var comments = gel("hr_comment").value;
   comments = trim(comments);
   if (comments == "") {
      //If comments are empty stop submission
      alert("Please provide comments.");
      return false;
   }
		
$('cancel_button').addClassName('disabled');
$('ok_button').addClassName('disabled');
	  g_form.save();
	return true;
}

function formFieldsValid() {
	return ($("hr_comment").value != '');
}

The processing script is:

(function(_this) {

	if (button_clicked == 'ok') {
		
		// Write the reason into task journal
		var task = new GlideRecord(task_table);
		task.addQuery('sys_id', task_sys_id);
		task.query();
		task.setWantSessionMessages(false);
		task.next();
		
		if (is_comment == "true"){
			task.comments = hr_comment;
					gsftSubmit(document.getElementById('sysverb_update_and_stay'));
		}
		else
			task.work_notes = hr_comment;
		
		if (is_close == "true")
			task.close_notes = hr_comment;

		if (state_sys_id != '') {
			// Move the State flow
			new StateFlow().processFlow(task, state_sys_id, 'manual');

		}

		if (dialog_type == 'escalate_case') {
			var manager = task.assignment_group.manager;
			var group = new GlideRecord('sys_user_grmember');
			group.addQuery('group', task.assignment_group);
			group.addQuery('user', manager);
			group.query();
			group.setWantSessionMessages(false);
			
			
			if (manager == '') {
				gs.addErrorMessage(gs.getMessage('{0} could not be reassigned because assignment group manager was not found.', task.number));
			} else if (!group.hasNext()) {
				gs.addErrorMessage(gs.getMessage('{0} could not be reassigned because assignment group manager is not a member of the group.', task.number));
			} else {
				task.assigned_to = manager;
				task.update();
				gs.addInfoMessage(gs.getMessage('{0} was reassigned to {1}.', [ task.number, task.assignment_group.manager.name ]));
			}
		}
		
		var url;
		if (state_sys_id != '') 
			url = task_table + '.do?sys_id=' + task.sys_id;
		else 
			url = GlideSession.get().getStack().bottom();
		
	response.sendRedirect(url);
	}

})(this);

I have reviewed 

https://www.servicenowguru.com/system-ui/glidedialogwindow-advanced-popups-ui-pages/

https://www.servicenowguru.com/system-ui/glidedialogwindow-quickforms/

but neither point me in the right direction.

Please help

[matt_a · Accepted solution]

Hi Ankur, I spoke to Hi about this as even with the log statements, it wasnt achievable to do what I wanted. 

Ultimately, the comment ui box is updating rather than saving so I would need to rebuild or just abort what I was trying to build.

I am now leaving it alone so no further help is required at this stage.

Thanks

1.0.0.20

[mjwhirly]

Hey Matt, 

    If you're still trying to work on this I'll provide you with my method for achieving this. My UI action button is used to resolve an incident, but can be tailored to work in the way you need it to. It also saves any changes made to the form prior to click it. 

UI Action Button Code:

function commentsDialog() {
   //Get the values to pass into the dialog
   var close_text = g_form.getValue("close_notes");
   var short_text = g_form.getValue("short_description");

   //Initialize and open the Dialog Window
   var dialog = new GlideDialogWindow("incident_resolve_dialog"); //Render the dialog containing the UI Page 'task_comments_dialog'
   dialog.setTitle("Add Required Fields To Close"); //Set the dialog title
   dialog.setSize(600,600); //Set the dialog size
   dialog.setPreference("close_text", close_text); //Pass in comments for use in the dialog
   dialog.setPreference("short_text", short_text); //Pass in short description for use in the dialog
	
	if(g_form.getValue("close_code")=="" || g_form.getValue("close_notes")==""){
    dialog.render(); //Open the dialog
   }
    else{
    g_form.setValue("state", 6);
	g_form.setValue("incident_state", 6);
	g_form.submit();
		
    }	
}



//Code that runs without 'onclick'
//Ensure call to server-side function with no browser errors
if (typeof window == 'undefined')
	serverResolve();

function serverResolve(){
	current.incident_state = IncidentState.RESOLVED;
	current.state = IncidentState.RESOLVED;
	current.resolved_by = gs.getUserID();
	current.update();
}

UI Page

function commentsDialog() {
   //Get the values to pass into the dialog
   var close_text = g_form.getValue("close_notes");
   var short_text = g_form.getValue("short_description");

   //Initialize and open the Dialog Window
   var dialog = new GlideDialogWindow("incident_resolve_dialog"); //Render the dialog containing the UI Page 'task_comments_dialog'
   dialog.setTitle("Add Required Fields To Close"); //Set the dialog title
   dialog.setSize(600,600); //Set the dialog size
   dialog.setPreference("close_text", close_text); //Pass in comments for use in the dialog
   dialog.setPreference("short_text", short_text); //Pass in short description for use in the dialog
	
	if(g_form.getValue("close_code")=="" || g_form.getValue("close_notes")==""){
    dialog.render(); //Open the dialog
   }
    else{
    g_form.setValue("state", 6);
	g_form.setValue("incident_state", 6);
	g_form.submit();
		
    }	
}



//Code that runs without 'onclick'
//Ensure call to server-side function with no browser errors
if (typeof window == 'undefined')
	serverResolve();

function serverResolve(){
	current.incident_state = IncidentState.RESOLVED;
	current.state = IncidentState.RESOLVED;
	current.resolved_by = gs.getUserID();
	current.update();
}

Client script on UI page

function validateComments() {
   //Gets called if the 'OK' dialog button is clicked
   //Make sure dialog comments are not empty
   var comments = gel("dial_comments").value;
   comments = trim(comments);
   var closecode = gel("closecode").value;
   
   if (comments == "") {
      //If comments are empty stop submission
      alert("Please provide comments to submit the dialog.");
      return false;
   }
   //If comments are not empty do this...
   GlideDialogWindow.get().destroy(); //Close the dialog window
   g_form.setValue("close_notes", comments); //Set the 'Comments' field with comments in the dialog
   g_form.setValue("close_code", closecode);
   g_form.setValue('incident_state', 6);
   g_form.setValue('state', 6);
   g_form.setValue('resolved_by', g_user.userID);
	g_form.submit();
}

Hope this helps!

Respectfully,

Matt