[Solved] Unwanted space between 2 elements showing - how to remove?

Hello!

I had set up a tagging system. Here, when ‘add a book’ is clicked, it shows the ‘hidden search (toggled element)’. When the user types name of book and clicks on ‘add’ the book gets shown.

Below that is a small description option to describe.

But when i preview it, there is a huge space between button ‘add a book’ and ‘description’ input. I am not able to figure out why is that big space showing.

the repeating group and the search option are ‘visible on page load’, but the group containing them isn’t and is set to ‘collapse when hidden’. It shows up only when the button ‘add a book’ is clicked so that the whole group gets toggled.

Please help!

need to put the elements that are hidden in a group that will be hidden and select collapse height when hidden.

Hi everyone!

Got the solution to this with this video by @romanmg! Thanks for making this tutorial

Yeah that is the way to do it…put the elements in a group that will be hidden and select collapse height when hidden. Then put a conditional on the element to hide when you want it to.

Remember that trick, it comes in handy for a lot of things, not just R.G.

Only thing is you need to think of the conditions to set for when it should be hidden.

I use this mostly on forms to set up multiple step forms.

1 Like

Thank you so much! Do you also know how to allow ‘closing of popup’ only when cancel button is clicked? Right now whenever you click outside, the pop up closes. I don’t want that.

You would need to make your own popup. The default function, and I don’t believe there is a way to change that, is for the user to be able to click outside of the popup to close it.

To make your own popup you create a group that I call “group-overlay”…this group will have a black background with some transparency to create the same ‘grey out’ effect you get with a popup. That ‘group-overlay’ should cover the entire page. Then in that group place another group that will be the ‘popup’ and have all the elements you want displayed.

The issue with this is that the page doesn’t automatically scroll to the popup when it is opened. You would need to in the workflow event you use to show ‘group-overlay’ also put a scroll to element action in the workflow.

There may be a way to override the default settings for closing the popup element, but I am unaware of it.

1 Like

Ok, I will try this. Thank you so much! :slight_smile:

This topic was automatically closed after 70 days. New replies are no longer allowed.