How To Reuse Client Side Script Code

David165 · ‎06-24-2019

Hi

I've written a short client script to change the colour of a selection value form field when the value changes. It works well, but I want to use the same code across quite a number of form fields. How can I put this code into a client side function that I can call for each of my form fields?

I looked at UI scripts, but my head exploded with the complexity of implementing these. Isn't there a simpler way to call a custom client side function?

Here's the onChange function I'd like to call for a variety of form fields:

function onChange(control, oldValue, newValue, isLoading, isTemplate) {
	
	var elementID = g_form.getElement(control.name);
	
	switch(newValue) {
		case "3": elementID.style.backgroundColor = "red"; break;
		case "2": elementID.style.backgroundColor = "orange"; break;
		case "1": elementID.style.backgroundColor = "yellow"; break;
		default: elementID.style.backgroundColor = "white"; break; }
		
}

Thanks in advance.

David

David165 · ‎07-26-2019

Hi

I'm delighted to report that I have, at last, resolved this issue. After weeks of trying different methods to load the functions I wanted to share between fields on a form (so I could call the same functions onChange on several form fields) I could get it to work by including my shared functions within <script></script> tags inside a UI Macro:

<?xml version="1.0" encoding="utf-8" ?>
<j:jelly trim="false" xmlns:j="jelly:core" xmlns:g="glide" xmlns:j2="null" xmlns:g2="null">
	<script>
		function calcgxpassessment() {

                  // My code here
		}
	</script>	
</j:jelly>

Within my code, I had to rework things like && and change double quotes because these are XML entities. I haven't tried replacing these with the correct XML entities (E.g replacing && with &&)

I then included the UI Macro in a UI Formatter

and then dropped the UI formatter into the bottom of the form.

Finally, I was able to call the function calcgxpassessment() onChange from any choice field that needs to recalculate the risk. I also had to remember to deselect "Isolate script" from these client scripts. Otherwise, they couldn't see the shared function.

My project is back on the rails 🙂

Regards

David

View solution in original post

Elijah Aromola · ‎06-24-2019

This script is a client script it's not being called via Glideajax.

David165 · ‎06-24-2019

Regrettably, this did not work either. The error message remains the same.

Using the onLoad to load client side functions would have been a handy solution, but it's beginning to look like I shall have to leqrn how to use the script includes and calling them with glide ajax. It just seems like using a sledgehammer to crack a nut.

Regards

David

Elijah Aromola · ‎06-24-2019

You got the error after "Isolate script" was unchecked on your onLoad script? If so, try clearing your cache in your web browser and try again. I was able to create the functionality in my developer instance that you are trying to achieve.

David165 · ‎06-24-2019

Yes, I got the error after deselecting Isolate script. I tried clearing my cache and still, I get the error. I keep looking to see if I've misspelt the function name in case its something as simple as that, but I can't find a problem after many scrutinies of the code.

Elijah Aromola · ‎06-24-2019

Is the UI type set to all?