Show/hide group condition not working

[Ramya-Devendiran]

Version 12.2.2
Umrbaco version 12.3.6

We added 2 page form to Form picker in a blocklist or embedded as macro in RTE in a blocklist. Page 1 has a Radio button list field and Page 2 has two groups.
Condition is set to show the group 1 when radio value is Test1 and to show group 2 when radio value is test2.

The page 2 is rendered but the fieldset is hidden.

Tried with and without "async" parameter @Html.RenderUmbracoFormDependencies(Url, new { @async = "async" })
and set options DisableClientSideValidationDependencyCheck to true when testing with "async".

"Forms": {
  "FormDesign": {
    "FormElementHtmlIdPrefix": "N_"
  },
  "Options": {
    "DisableClientSideValidationDependencyCheck": true,
    "DisableRelationTracking": true
  }
}

Steps to reproduce.

Create a form with 2 pages.
Page 1:
Custome: Radio button list - values private, company.

Page2:
Group1: set condition to show group when radio Quantity is "private".
Name: short answer field.

Group2: set condition to show group when radio Quantity is "company".
Organisation name: short answer field.

Add the form to a formpicker in a block list element.

Select "private" in the form.

Expected result:
Show Name.

Actual result:
it is showing only the PAGE2 title and the fields are hidden.

[AndyButland]

Could you confirm if you are using a custom theme here please, or the default one? Thanks.

[Ramya-Devendiran]

Yes, I am using default theme. And I have edited the form.cshtml and render.cshtml for css changes.

[ronaldbarendse]

Thanks for also including the Forms settings, as the issue might be caused by setting a custom FormElementHtmlIdPrefix. Can you test again without this setting applied, so we can single out whether this is the cause?

If removing this setting fixes the problem, make sure you're using the latest JS assets (/App_Plugins/UmbracoForms/Assets/themes/default/umbracoforms.min.js - which is provided by the Umbraco.Forms.StaticAssets Razor Class Library), because I couldn't replicate the issue when conditions are set on both the page, group or fields themselves...

[Ramya-Devendiran]

I have removed FormElementHtmlIdPrefix settings and restested. The issue persist. The conditions are not working.
I added FormElementHtmlIdPrefix in first place as fix to the issue.

[AndyButland]

OK - you said above that you are using default theme, but have also made some edits to specific files. With Forms 12 the default theme is shipped as a compiled razor class library, so you can't edit the files directly, so it sounds that maybe you have made a custom theme but have just amended one or two files.

If I've understood that right, would it be possible to share the .cshtml files you have edited please, so I can run with them locally to see if we can replicate the problem? Thanks.

[Ramya-Devendiran]

render.txt
form.txt
Attached Form.cshtml and Render.cshtml

[AndyButland]

I think you are missing a couple of updates that you should apply from the default theme.

In Form.cshtml, where you have:

<fieldset class="umbraco-forms-fieldset" id="@fs.Id" @{
  if (hideFieldSetWhenRendering) {
    <text> style="display: none" </text>
  }
 }>

And:

<div class="form-group @(f.Mandatory ? "required" :"") @Html.GetFormFieldWrapperClass(f.FieldTypeName) @f.CssClass" @{
  if (hideFieldWhenRendering) {
    <text> style="display: none" </text>
  }
 } >

Replace with:

<fieldset class="umbraco-forms-fieldset@{ if (hideFieldWhenRendering) { <text> umbraco-forms-hidden </text>  } }" id="@fs.Id">

And:

<div class="form-group @(f.Mandatory ? "required" :"") @Html.GetFormFieldWrapperClass(f.FieldTypeName) @f.CssClass  @{ if (hideFieldWhenRendering) { <text> umbraco-forms-hidden</text>  } }">

I think that should sort it out.

For background these changes were made in relation to the issue raised in #1110

[Ramya-Devendiran]

It didnt work even after replacing inline style with a class.

I changed the hide flag set condition to checked for actionType "HIDE" instead of "SHOW" which was in the default form template.
bool hideFieldSetWhenRendering = fs.HasCondition && fs.ConditionActionType == FieldConditionActionType.Hide;

Now it is working.

[AndyButland]

OK, glad you've sorted it.

I think...

bool hideFieldSetWhenRendering = fs.HasCondition && fs.ConditionActionType == FieldConditionActionType.Show;

... should be correct though. The idea here is that the field will only be shown when a condition is true, so by default it should be hidden when rendering.

But if it's working for your conditions setup then all good.