I’m trying to set a specific state on the verification code component. My goal is just to have a styling change based on if there is something input or not. Since the value of each of the inputs isn’t easily accessible I have to use this Javascript in order to get the value of the current input
return context.thisInstance.firstChild._value != ' '
It will correctly set all of the values and correctly highlight the boxes that should be highlighted after I set the formula but then it seems like it never recalculates. If I look at the formula and the editor again all the values show correctly, but it’s like the state never gets activated or deactivated.
For reference if there is a number input, the box should be orange. But if there is no input, the box should just have this standard gray border.
I think you’ll have to make this yourself, or employ some more complex JavaScript. I think you might be hitting a wrapper of some sort in the Markup of the Verification Code Component. Or you could fork the component on Github and alter it. Also, the not re-calculating might be because the Custom JS is not reactive where as the Vue.js state that you’re used from WeWeb has this thing called reactivity.
Hmmmm okay… 
Do you think there could be any other creative approaches to solve the reactivity thing? Like storing the value in an array var. and comparing against it…? I guess I still wouldn’t have reactivity though 
The formula I have does get the correct value that I can get on blur, but I’m not sure how to relate the to the specific input element since the elements also don’t have an id set.
You could try to hack it with either an on variable change workflow in a reusable component, or by using your JS inside a formula, formulas are reactive as well as the first option, so in theory each change of the value will re-trigger the JavaScript code there.
Ah, I didn’t know there was a different in reactivity between formulas and states!
I tried it and it partially works. 
When I delete an existing number, the formula properly functions, however when adding a new number, it’s like it progresses too fast and the formula doesn’t calc. I need to refocus it to correctly render. I’ll have to experiment further
It might be because the focus runs very fast, for example there is some events, like mousedown, that run before the blur/focus. Clicks trigger after etc.