[Click to add] user input

Ask the community
, ,
1

I am trying to build a recipe sharing website like “allrecipes”, though I do not want to fully copy their design and function
I am trying to make a form to upload the recipe.
Of course in recipes, there is more than one step. I want to make a form where if you press a button that says, “click to add” to add a new user input for 1 step. Simple prototyped design is as attached. How would I make this function? and what will the database look like?

724×382 9.57 KB

2

Hello,

i would suggest using a repeater, that would work as follows:

  • add a repeater .

  • customize the design as you want.

  • connect the repeater to a data set.

  • on click add an item to the repeater’s data set, this way it will be shown as an extra repeater item.
    but you can’t add user inputs to a repeater. so in this case if you have a limited for the number of steps, it can be solved as follows:

  • create all the steps (lets say 5)

  • show only the first one and hide the other 4 steps

  • add on click button

  • on click show the next step

  • when all steps show disable the button

750×374 22.7 KB

make sure u put each step in a box and name the box with the step order as shown in the image shown before (name of the box is step5), the you can show the next step using this code:

let count = 2;
export function add_click(event, $w) {
	//Add your code for this event here: 
	$w('#step'+count).show();
	count = count + 1;
	if (count > 5 ){
		$w('#add').disable();
	}
}

Massa