We have dynamic forms where fields are hidden or shown depending on selections. Recently they have started to have whitespace where the hidden fieds are...this causes the user to think it is a blank form when they don't know to scroll down. See the screenshot.
Dear @IT.Joe,
Yes, thank you for the report! This is due to some changes we've added to the Grid container, though this particular effect is unintentional.
We'll release an update with a bugfix ASAP, and it should go back to how it was!
Great! Let me know when it is switched back
Dear @IT.Joe,
We've released a fix! Please, make sure to clear browser's cache and it should auto-apply. You can also try incognito mode in browser to check it out.
I cleared cache and also tried incognito and the whitespace is still present.
Dear @IT.Joe,
Are you sure you have the latest app package installed in the App Catalog? Please, make sure it's added from Microsoft AppSource like the instruction says here - Installation of Plumsail Forms for SP Online (Microsoft 365) — SharePoint forms
I have this installed already but the issue is on the Public Forms not the Sharepoint Forms.
Dear @IT.Joe,
I've discussed with the dev team potential reasons - can you share with us how the fields are currently hidden? The new recommended way is to use JavaScript:
fd.field('FieldName').hidden = true;
This will automatically detect empty rows, and switch them to hidden state.
I use the below....so I have to go back and change all my code to match the other way?
$(fd.field('Q1').$parent.$el).hide();
$(fd.field('Q2').$parent.$el).hide();
$(fd.field('Q3').$parent.$el).show();
$(fd.field('Q4').$parent.$el).hide();
$(fd.field('Q5').$parent.$el).show();
It worked for fields but what about hiding containers based on Class...it still shows the whitespace. Example here...
$('.valid').show();
$('.validate').hide();
Hi.
I have just updated the app for spo forms and my grids are showing whitespace. I have the class in the form and this is the code in our external js file: $('.gridNewEmpType').hide();
Was working fine before the upgrade.
Dear @cknightTSY,
Consulted with the dev team, please, try the following approach:
$('.grid-cell').parent().hide();
Hi. I've done this and still whitespace
Should I apply this to the grid class? grid-auto-flow: dense; If so, where would I put it?
Dear @cknightTSY,
Where are the classes applied to? Are they applied to the elements or to the grid cell, like so?
It's important that they are applied to the Grid cell. If it still doesn't work, please, export and send us the form to support@plumsail.com
Thanks. Guessing this is now the same for buttons? I had the reference in the General section and it was working fine before app update. Thanks