Is there a way to write a JS function that accepts input so I can reuse it in several places in my application?
For example, if I wanted a function that looks like this:
function feetToInches(feet) { return feet * 12 }
(the real function is much more complicated than this)
And then in my components I could reuse this function with different input values every time.
Is this possible?
I tried using Javascript Queries/Transformers but they don't accept inputs as parameters, they can only use existing state like a specific query result.
for each input you could replace the temp state value (name it state1) with that input
and then in the js query you can set it to return
{{state1 * 12}}
but you wouldn't need the js if you simply want to display {{state1 * 12}} you can just add that in a default value field of another component (text, a column of a table..etc..)
if you can add more details and screenshots, I can reproduce it for you if you want
To be clear, the example I gave of multiplying by 12 is much simpler than my real use case, which is about 15 lines long.
I think the "temp state" solution won't work for me because I need to display several results of the function simultaneously, so I need more than 1 global input.
I find it really weird that I can't simply define a function...
Then you just call the feetToInches() function normally any place in Retool that can do Javascipt, like here where I am using a function as a column value:
Got it, that's what I was looking for. Thank you.
It's a little weird that you need to define it in an area that's "external" to where you define Transformers, Queries, etc. but this is a good solution.
I can't get a global function to work. I want to create a sort of profile routine that will show me how long functions take to run and if I'm calling them more than once. So I created a global temp variable and my plan is to write to it at the start of a js query and the end of the js query. What am I doing wrong here?
I do not believe you can use Retool scoped variables ( as defined by needing handebars {{ }}) in a global function. You will need to pass another parameter for call_log.
A basic reason a global function will not work is if there is an error in it - which using {{ }} basically is in this case. You can check on Syntax errors and Runtime errors in your code in your browser's dev tools.
I wanted to point you to a closed alpha we just launched for Sync Functions, which may be of interest to those in this thread. Let me know if you'd like to be added!
