Boolean switch unuseable inside flow part

[Flarescape]

As the title says, the boolean field switch does not work inside a flow part.
The switch does nothing on click.

[Skrypt]

A BagPart content item boolean field switch doesn't work.
Repro :

Here is the rendered Bootstrap switch :

<span class="switch">
        <input type="checkbox" class="switch switch-sm content-preview-select" data-val="true" data-val-required="The Value field is required." id="z99ffbbf8e726edae142ff0bb052f263_Acme2_Active_Value" name="399ffbbf8e726edae142ff0bb052f263.Acme2.Active.Value" value="true">
	<input name="399ffbbf8e726edae142ff0bb052f263.Acme2.Active.Value" type="hidden" value="false">
	<input name="399ffbbf8e726edae142ff0bb052f263.Acme2.Active.Value" type="hidden" value="false">
        <label for="z99ffbbf8e726edae142ff0bb052f263_Acme2_Active_Value">Active</label>
</span>

If I'm removing the 2 hidden inputs that are placed in between the checkbox and it's label then the switch works. So, here the hidden inputs needs to be appended before the checkbox input or after it's label else it breaks the component.

[Skrypt]

I tested the preview here with the predefined lists to make sure it's working with a BagPart and it worked.

[sebastienros]

maybe a conflict when there is another one on the page like in the screenshot?

[Skrypt]

Not related to having an other one. I added it on the main content type to see the difference in the HTML rendered but it was not working for the one in the BagPart before I added the one on the main content type.

[Skrypt]

There is clearly an issue when the hidden inputs are appended since we can see that they are duplicates.

[Skrypt]

Here is the HTML of the main content type one :

<span class="switch">
        <input type="checkbox" class="switch switch-sm content-preview-select" data-val="true" data-val-required="The Value field is required." id="Acme_Active_Value" name="Acme.Active.Value" value="true">
        <label for="Acme_Active_Value">Active</label>
</span>

No hidden input required for this one. So it might be an issue with the preview script or the FlowPart script.

[Skrypt]

It's not coming from the contentpreview.edit.js.

[agriffard]

When you add in a Form a widget that has a BooleanField, it adds 2 hidden input. Ex:

<span class="switch">
        <input type="checkbox" class="switch switch-sm content-preview-select" data-val="true" data-val-required="The Value field is required." id="z059826f467d4e1dab99b79ae8c02b67_RichContent_Visible_Value" name="2059826f467d4e1dab99b79ae8c02b67.RichContent.Visible.Value" value="true">
<input name="2059826f467d4e1dab99b79ae8c02b67.RichContent.Visible.Value" type="hidden" value="false">
<input name="2059826f467d4e1dab99b79ae8c02b67.RichContent.Visible.Value" type="hidden" value="false">
        <label for="z059826f467d4e1dab99b79ae8c02b67_RichContent_Visible_Value">Visible</label>
    </span> 

If the field is using a switch Editor, it prevents to switch the property after the widget is added.

When it is saved and reedited, the 2 inputs don't appear anymore and it works.

[sebastienros]

Can we check that this line is not generated twice also in a standard editor?

[gvkries]

This seems to be outdated and is fixed, since the admin has been upgraded to Bootstrap 5.