code to Call UI page from UI action button

[Abhishek64]

I have created a UI page name “ui_page_demo” like below

 Now I want to create UI action button on the Incident table when I clicked UI action button this page will pop up

Please share the exact code from which I can pop up this form when I clicked on UI action button

[Community Alums · Accepted solution]

Hi Abhishek,

You can create a UI Action on any Form or Table and then on click of the UI action I am going to show you how to call a UI Page.

For example, I have created a Ui action named "Community UI Page Help" on the Incident table and on click of that UI action I am displaying a UI Page which has only One Field as of now and two buttons "OK" and "Cancel". On selection of any o those buttons an operation happens on the Incident form which is explained below.

Follow the steps mentioned below:

• Create the Field or use the field which you want to display in your UI Page.
• Create the UI action with code as mentioned below:

function showPage(){
	var gdw = new GlideDialogWindow('community_ui');
	gdw.setSize(750,300);
	gdw.setPreference('table_name', g_form.getTableName());
	gdw.render();
}

Next thing is to create the UI Page which will be called on hit of this UI action. In my example UI Page name is "community_ui" as called in UI action in Line 2.

You can refer the code below which is documented to understand on what is being done:

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">
	<g:evaluate>
			var tableName = RP.getWindowProperties().get('table_name');  // Getting the Target Table Name for which the operation needs to be done
			tableName;
	</g:evaluate>
	<g:evaluate>
		var choices = new GlideRecord('sys_choice'); //Querying the choice table to get the values which needs to be displayed in the Dialog Box
		choices.addQuery('name', tableName);
		choices.addQuery('element', 'u_choice_type'); //Give your Field Name created which needs to be displayed in the UI Page which opens on click on UI action
		choices.addQuery('inactive', false);
		choices.orderBy('sequence');
		choices.query();
		choices;
	</g:evaluate>
	<table style="margin:20px 10px;"> //Give your CSS Styles as required
		<tr>
			<td>
				<label for="inc_cause"> Incident Cause</label>
			</td>
			<td>
				<select id="inc_cause">
					<option value="" selected="selected">-- None --</option>
					<j:while test="${choices.next()}">
						<option value="${choices.value}">${choices.label}</option>
					</j:while>
				</select>
			</td>
			
		</tr>
		<tr>
			<td colspan="2" style="text-align:right;padding-top:10px;">
				<button class="btn btn-default" onclick="closeWindow()" style="margin-right:10px;">Cancel</button>
				<button class="btn btn-primary" onclick="update_ticket()">Ok</button>
			</td>
		</tr>
		
	</table>
	

</j:jelly>

Client Script:

gel('inc_cause').value = g_form.getValue('u_choice_type');

//If OK Button is pressed then this functionis called as defined in HTML Line Number 34
function update_ticket(){
	var abc = gel('inc_cause').value;
	g_form.setValue('short_description',abc);
	g_form.save();
	GlideDialogWindow.get().destroy();
}


//If Cancel is pressed then this functionis called as defined in HTML Line Number 33

function closeWindow() {
	GlideDialogWindow.get().destroy();
}

Below are images for the same.

If you want to learn more on Jelly Script or how to wrote UI Pages would strongly recommend to go through Tech Now episodes hosted by Chuck Tomasi available on you tube. Below are links for the same:

https://www.youtube.com/watch?v=_MhWugMQegs

https://www.youtube.com/watch?v=Td7t_tiehzY

https://www.youtube.com/watch?v=gPy5xkks0tA

OR 

If the UI Action runs server-side you can use gsftSubmit in your UI Pages Client Script.

The script below will trigger a submit UI Action causing the form to save.

// Replace "sysverb_submit" with whatever "action name" is set on the UI Action that you want to trigger.

gsftSubmit(null, g_form.getFormElement(), 'sysverb_submit');

UI Action

Mark my answer correct & Helpful, if Applicable.

Thanks,

Sandeep

[Ulrich Matthew]

ia there a way to call the UI page without checking  client checkbox?