Modal inside ActiveForm not closing when clicking on overlay

[niklaswolf]

When I render a modal inside a ActiveForm, the modal can't be closed by clicking on the background/overlay. When the modal is rendered outside of the ActiveForm, everything works fine!
Here's the markup:

<?php $form = ActiveForm::begin(['options' => ['enctype' => 'multipart/form-data']])
    ...
    Modal::begin([
			'header' => 'Some title',
			'size' => Modal::SIZE_LARGE,
			'toggleButton' => [
				'label' => "More info",
				'class' => 'btn btn-sm btn-info'
			]
		]);?>
		<div class="info-content">
			...
		</div>
   <?php Modal::end();
   ...
ActiveForm::end()?>

[samdark]

Any errors in browser console?

[dynasource]

you should not put Modals inside forms. It should be the other way around, as Modals can be prepended or appended to the DOM.

[niklaswolf]

It's okay that this issue is closed as I can confirm that this actually works in my usecase in another form on the site. So the issue is in my code, rather than the widget, sorry for that.

But I don't completely agree with your answer... Why shouldn't I generally want to do this? Let's say there's my case where I want to have a "Additional Info"-button next to a form-field to show some additional information for this field in a modal. I think this is a real usecase to do so... Or did I misunderstand your answer?

[dynasource]

no worries. You're right about your 'additional info' example. That's a valid usecase. What I meant was that one should not wrap input elements inside a form with a modal