laravel-form-builder icon indicating copy to clipboard operation
laravel-form-builder copied to clipboard

Radio buttons don't get disabled and can't be selected clicking the label when they contain the required rule

Open yanvv2 opened this issue 5 years ago • 9 comments

When a radio button has the 'required' rule, it doesn't get disabled when calling 'disableFields()'

yanvv2 avatar Jul 05 '19 12:07 yanvv2

Additional issue when adding the required rule to a radio button is that the label for the button isn't clickable. (Does work without the required rule)

yanvv2 avatar Aug 01 '19 13:08 yanvv2

How do you make the radio button field? Where/how do you call disableFields()?

rudiedirkx avatar Aug 09 '19 10:08 rudiedirkx

I call disableFields() from my controller ->

$form = $builder->create(
    LocationForm::class,
    [
        'url'   => $urlGenerator->route(
            'location:locations.update',
            [
                'location_id' => $locationId,
            ]
        ),
        'model' => $locationData,
    ]
);

// Set the form as read-only
$form->disableFields();

I have this in my form class ->

$selectOptions = [
            _('No'),
            _('Yes'),
        ];

        $this->addField(
            new ChoiceType(
                'reservation',
                Field::CHOICE,
                $this,
                [
                    'label'    => __('Reserved'),
                    'choices'  => $selectOptions,
                    'expanded' => true,
                    'rules'    => [
                        'required',
                        Rule::in(array_keys($selectOptions)),
                    ],
                ]
            )
        );

And my view ->

<fieldset class="form-group">
    <div class="row">
        {!! form_label($form->reservation) !!}
        <div class="col-8">
            {!!
                form_widget(
                    $form->reservation,
                    [
                        'choice_options' => [
                            'attr' => [
                                'class' => 'form-check-input'
                            ],
                            'label_attr' => [
                                'class' => 'form-check-label'
                            ],
                            'wrapper' => ['class' => 'form-check form-check-inline align-middle pt-1']
                        ]
                    ]
                )
            !!}
        </div>
    </div>
</fieldset>

As soon as I remove the required rule in the form class, the radio button gets disabled and labels are clickable.

yanvv2 avatar Aug 09 '19 11:08 yanvv2

You should add fields with add(), not addField(), but that's probably not it.

Works fine for me. Both ways of adding. Don't know about the clickable label. Seems like your code is messing up attributes somewhere... You'll have to debug it, because your scenario is apparently different.

rudiedirkx avatar Aug 11 '19 16:08 rudiedirkx

Nope. You're right. I didn't read good. Adding the required rule adds attributes to the children through ParentType, which messes up other attributes. This is why I never use ChoiceType (or other ParentType fields). I think there's an issue about this somewhere, but I can't find it.

I think the problem comes from the rules-to-html5-attributes logic. The problem might go away if you disable $clientValidationEnabled in the form class:

protected $clientValidationEnabled = false;

Not really a solution, but kinda..?

rudiedirkx avatar Aug 11 '19 16:08 rudiedirkx

When disabling $clientValidationEnabled it does indeed work as a quick fix

yanvv2 avatar Aug 13 '19 13:08 yanvv2

Nope. You're right. I didn't read good. Adding the required rule adds attributes to the children through ParentType, which messes up other attributes. This is why I never use ChoiceType (or other ParentType fields). I think there's an issue about this somewhere, but I can't find it.

I think the problem comes from the rules-to-html5-attributes logic. The problem might go away if you disable $clientValidationEnabled in the form class:

protected $clientValidationEnabled = false;

Not really a solution, but kinda..?

What do you use then if you have to display radio buttons?

kennaar avatar Aug 21 '19 14:08 kennaar

I created custom 'radiobuttons' and 'checkboxes' fields, and only use 'select' for dropdowns, never 'choice'. I've been meaning to create an add-on package for all of that, but I've been meaning to do a lot. I'm too busy sleeping in and playing games and watching movies. I have a very tough life!

But this is a bug and it shouldn't exist, so PR very welcome. It's a tricky one, because sometimes you want attributes to copy to children, and sometimes not, soo....

rudiedirkx avatar Aug 21 '19 21:08 rudiedirkx

@rudiedirkx pershaps you could share your classes as gists?

kmbt avatar Aug 23 '19 08:08 kmbt