Import/create variables in Bulk

Ask us anything
1

Hello,

I have about 150-200 variables to create. I can do it manually but would be happy to know if there is a faster way like a csv or something. Is it possible ?

Thanks

2

There is no automagical way.

You could create a gen_var that is an object and work with your 500 cars as props on 1 object but that sounds rather unwieldy.

That is a lot of different variables.

My approach when I find myself running up in variables, is to create variables, such as temp_string, temp_int, temp_object and so on.

What I found is While my list may Physically grow larger and larger conceptually, it really doesn’t need to. I am often creating the same type of variable across pages to be used for example such as holding information like a string that will only be accessible on that page and then it is gone when you go to the next page.

So anything that could conceivably be reused across pages is thrown into one of the temp variables. I really like a temp object because then I can just at Will create properties and manipulate the data within that path of the object variable instead of needing to have 500 (for example) different variables.

3

Hi Jared,

Thing is I have a multi-step form which should adapt given the answer provided by the user. Let’s say the first question consists of 4 options (A,B,C,D) if you choose A you have a dedicated lists of questions throughout the form. I use the switch formula to display the right question depending on the option chosen.

The challenge is that it makes rather long texts in the formula bar which I find difficult to read and change. While variables is much easier to maintain. It’s just very time-consuming to create.

Now if you (or someone) has a better way - happy to explore it !

So today on Weweb, there is no way to create variables in bulk ?

4

@MrUnfreeze I would say you do the magic in workflows and not in the formula bar. So make the ENTIRE FORM one single json object variable
And tie all of the logic of which question to display based on the answer the user gives to 3 element actions

  1. OnChange
  2. Previous Button
  3. Next Button etc.

I have found that using formula for complex logic may work, BUT

A. They are the first to break when moving from one project to another. If you want to port that logic to another project tomorrow, best believe you will re-do all the bindings (trust me this is learned hard experience)
B. Like you have discovered they become hard to read once they get long enough

A simple multi-select action block is infinitely more readable and still uses the same switch logic (I have one with 33 different outcomes possible and it is still readable, that would be impossible in the formula bar. So my advise will be to

  1. Use a single json object
  2. Fetch some data incrementally from the backend (cos too much data in your frontend and it will slow down a lot)
  3. Anchor the display logic to 3-5 element triggers the ones I always use are onChange, onMounted and Before Unmount and of course button click (which will be ‘previous’ and ‘next’ for you)

By the way this is the exact same way JotForm and N8N and all the professional form builders out there are made. It’s called Intermediate Representation (IR) in your case your user is simply editing a JSON object (the IR) and then when they press submit, that JSON object now contains all of the details on their choices which you can use to interact with your backend. This is FAR easier to maintain for you longterm than hard coding 200+ variables which every single time you need to add a new field means more variables. It will get unwieldly fast

I hope this helps.

2 Likes
5

Hi @AgentD

Many thanks that is really helpful ! I’ve no coding background, but I may be able to ask an LLM to help with the JSON object.
However, an example could certainly help because I have no idea how to put that into motion! Would it be possible (even in private) to send me an explaining Loom or screenshots ?
Thanks

6

Hi. Hmmm. It may be difficult to record anything as I am on a trip without my PC. But stay with me, let me explain the process in detail. And you can put this explanation in your AI (whichever one you use) and it will explain it further.

So. Step one. We want to capture EVERYTHING about the form in a single JSON object. This allows us to dynamically render the form anyway we want. So

  1. Create a json object!
  2. Now define the fields that make up the form each field will be a key in the json object representation. For example
{
"title": "This nice form"
"demography": [ { "question": "how old are you?", "input_type": "number", "required":true, "answer": "" }, { "question": "What is your name?", "input_type": "single-line text", "required": true, "answer": "" }, { "question": "Tell us your bio?", "input_type": "multi-line text", "required": false, "answer": "" } ]
// other fields go below here.... based on the segments, demography is just an example
}

Now once you have your JSON tree defined like this, this is your form. Now in Weweb you create the “form“ you can use accordion to make the form. Each accordion will represent a segment (so you can collapse and expand segments, if your form will be very long). Now when a user reaches a segment (all the input fields are rendered based on what is present in the key belonging to them in the JSON object. So in the segment `demography` your input boxes are bound to this array:

[ { "question": "how old are you?", "input_type": "number", "required":true, "answer": "" }, { "question": "What is your name?", "input_type": "single-line text", "required": true, "answer": "" }, { "question": "Tell us your bio?", "input_type": "multi-line text", "required": false, "answer": "" } ]

So you can then use one single action onChange to save the input to “answer“. Now to conditionally show or hide any field, you just go to the field’s display toggle and bind to the parent variable’s value. So the logic will be something like if( variableName.demography[0].answer > 18, true, false ) so in simple english you are saying if the user’s answer to how old are you is > 18 then display this input field to them.

Do you see how that works? So one variable is all you need to hide and display as many inputs as you want. And you have just one action to capture their response (onChange). If you don’t understand it. Put it in an AI bot they’ll explain and ask it to give you `step by step examples`. This is how form builders are made - typeform. jotform, n8n all of them. It’s the same basic logic. This way to add a new segment to your form is just add another key to the json object. That’s all. No new variables.

Cheers

1 Like
7

Hi AgentD,

Thanks ! So I tried to apply your solution and honestly could not figure out precisely how you did but I think I somehow found a way.

I ended up linking every “question” field to a workflow → change variable value , and within this a little javascript that works just fine! I wonder whether that’s the best solution but it works for me so I will go with this for now haha.

Many thanks for all your precious help !

1 Like