[how-to] Use a global lookup array on all of your apps

Say you have an array you use over and over, for example a Select component populated with a list of states or a list of commonly used time zones. Rather than having to copy/paste the state array to every Select component, you can define it in a single place and all for your apps can see it.

Management tells you that the company will be selling to Guam and British Columbia and you did not include GU or BC in your states list. Now you have to hunt down every state drop down and modify it. Ouch!

Do this instead. Go to your organization's Settings window:

image

or

image

Go to the Advanced tab on the left. and scroll down to the Preloaded Javascript section.

Add this function (modify states array fit your needs):

window.states = function() {
  return ["AK","AL","AN","AR","AZ","BC","CA","CO","CT","DC","DE","FL","GA","HI","IA","ID","IL","IN","KS","KY","LA","MA","MD","ME","MI","MN","MO","MS","MT","NC","ND","NE","NH","NJ","NM","NV","NY","OH","OK","OR","PA","RI","SC","SD","TN","TX","UT","VA","VT","WA","WI","WV","WY"]
}

Save that and go to the app that needs a states drop down. If your app is already opened, you will need to refresh the page to load the new functions.

Now just add {{states()}} to your data source:

image

Now when you need to add GU or BC to your list, you only have to do it one place.

5 Likes

Nice! Thanks @bradlymathews