UI Script - Global checkbox = false - Application = Global

[G24]

I want to define a reusable utility function for use in client-side code, for example in Form and List View UI Actions.

I do NOT want to declare a Global UI Script, but I am working in the Global Application, not a Scoped Application.

How do I achieve this?

[G24 · Accepted solution]

Step 1 - Define a System UI - UI Scripts record as follows:

                Name: MyCrazyUIScript

                UI Type: Desktop

                Global: Unchecked

                Description: Reusable Client-Side utility function for use in Forms and List Views.

                Script:

/* eslint-disable no-console */
/* eslint-disable no-mixed-spaces-and-tabs */
MyCrazyUIScript = (function() {

	return {
		myUtilityFunction2: function(myParameter1, myParameter2) {
			console.warn("Hello World!  myParameter1: " + myParameter1 + ".  myParameter2: " + myParameter2);
			return myParameter1 + myParameter2;
		},
		type:  "MyCrazyUIScript"
	};
	
})();

               Screenshot:

                Things to Note:

- The Application is Global, but the UI Script is NOT Global (in this use case).

- This example accepts 2 input parameters, but those are optional.

- This example returns a value, but that is optional as well.

- If you make ANY UPDATES to the UI Script after initially saving it, you must use Ctrl Shift Delete to clear the browser Cache to see those updates working!

Step 2 - Use the utility function from Client-Side code such as a UI Action.

                Name: MyUIAction

                Client checkbox: checked.

                Onclick: runMyUIAction()

                Script:

/* eslint-disable no-console */
/* eslint-disable no-mixed-spaces-and-tabs */
function runMyUIAction() {

	function myClientSideCallbackFunction2() {
		console.warn("A");
		//This just verifies that the function was successfully loaded.
		console.warn("myUtilityFunction2: " + MyCrazyUIScript.myUtilityFunction2); 
		var myResult = MyCrazyUIScript.myUtilityFunction2("P1", "P2");
		console.warn("myResult: " + myResult);
		console.warn("B");
	}

	console.warn("1");
	ScriptLoader.getScripts("MyCrazyUIScript.jsdbx", myClientSideCallbackFunction2);
	console.warn("2");

	return;
}

                Screenshot:

                Things to Note:

- In step 1, you tell the ScriptLoader, to explicitly load the non-global script you have specified, and when it is done, to call a callback function.

- You MUST include the suffix ".jsdbx" after the name of your UI Script.  This tells the Script Loader how/where to find your UI Script.  Just do it.

- In step 2, you define your callback function.

- In step 3, you make use of the actual utility function you care about…  You MUST include the name of the UI Script in front of the name of the utility function, or the call will fail.

- The callback function can be declared "inline" if you prefer that style, but not matter how you declare it, it will be called asynchronously.

Result:

If this helped you, please mark as Helpful!  Good luck.

[G24]

If you need a UI Script for a Scoped Application, see this article 

[Brad59]

This post was integral to solving how to load the AWS SDK into a Client Script inside a UI Page. Thank you!

for anyone searching in the future. I used the exact method depicted here but called the AWS SDK straight from the public URL.

ScriptLoader.getScripts(['https://sdk.amazonaws.com/js/aws-sdk-2.1.24.min.js'], clientCallbackFunc); // AWS SDK loaded from public URL source

[VaishnaviSa]

Is this method will work in client script? i have a global UI script that is been used in 3 client scripts but due to performance issue i need to make it non- global will it work?