Hi, I am new to Xano/WeWeb and have quickly discovered it’s not for the faint of heart!
To learn - I am duplicating a vessel catalog. But am having trouble with Parent/Child checkboxes.
1 - You add a vessel and save.
2 - Then you choose a Category/SubCategory for the vessel. Which is where I am stuck.
3 - Alignment is off between parents and their checkboxes
4 - Hoping someone can look at a screen capture and tree structure and give me a helping hand.
5 - So many nesting/renesting things, I try, are not permitted.
6 - But I feel like I’m close to crossing this hurdle (famous last words).
I think from the image - the alignment and/or nesting issue is apparent. But will answer any questions I can. Thank you.
I’m not 100% sure of what’s the final design you want to achieve, but here is one way of structuring it, maybe with less nesting which can complicated things. You can add style to the div Subcategories to add extra left padding too. Would that answer your need?
I see other struggles with that type of component when you’ll want to interact with it, store values.. let us know if you run into other complications, happy to help!
Little background - this is a catalog of inland marine vessels.
Agents will login->add vessel specs → save to continue and this list will appear.
They will click on a child category and parent will highlight - so two checkboxes active per vessel. (Or atleast that is my goal)
I am recreating based on a wordpress/woocommerce catalog.
At some point I would like two columns that collapsed to one column on mobile - just for space saving → not the categories in one column and sub in another. Two columns to keeps it from being a long scroll. If that makes sense.
But this has been harder than first thought. And after three days of trying to get strategy to work - finally broke down and wrote on community. The nested flexboxes with repeating elements has been nothing short of a bit of a nightmare (I am novice at best) - But hey - at least I have gotten things connected up to this point. (it’s the small victories that keep me going)
Looking forward to setting up using your suggestion shortly - very cool! And thanks again.
And - I’m stuck. I wanted to follow what you did → but problem is that I don’t know the underlying elements as you renamed them. Looking at the structure:
What is in “Container” - that is currently collapsed.
Well… I got it. I think. I guessed at some things. Then ended up moving the subcategory up - as a last resort. And the nesting took.
Question 1: Why I am grateful this worked, I don’t really understand why this solution worked when previous attempts did not. Thoughts?
Question 2 (nevermind): As a column the list is long. Is there an easy way to break it into a second column at “Model Bow for Sale” but have it collapse into one for mobile? → Not a fan after breaking it into 2 col. grid.
Functionality Question (Most Important): When a SubCategory is clicked - I would like that main category to also highlight. i.e. Check “Tank Barges for Sale” and “Barges for Sale” automatically checks also. – Both the Category and the SubCategory need to be passed back.