Closed juuuuln closed 3 months ago
Upon reviewing the demo in ux.symfony.com on LiveCollectionTypes I just noticed that the demo DOES throw an error on empty submission.
The embedded form type demo explicitly mentions the solution:
->add('description', null, [
// added because setDescription() doesn't allow null
// it would be simpler to make the arg to that method nullable
'empty_data' => '',
])
Upon setting 'empty_data' => '' on every required field in the embedded form, the validation triggers without any issue both on empty form submission as well as submitting with required fields being empty.
In a nutshell:
Embedded forms do not show form errors when submitting a new blank form or when a form field that is supposed to have a value is left blank.
Longer explanation:
Let's say I have a very basic UX Live Component, that only renders the form and processes the submission.
I add the LiveCollectionTrait and initialize the form, and create a function for submitting the form:
This ParentFormType form contains just one field:
Let's say, for simplicity sake, ChildEmbeddedType contains just one field:
I render the form inside the component's Twig template as I should:
Alternatively, if I define the form field, explicitly with an error var, the same behavior is observed:
On my home.html.twig I include this component:
I load the page, add a new collection type, enter 1 character into my "name" field, the component automatically re-renders, and I get a neat validation message right below the form field: "The value is too short, it should have" etc. etc.
So validation works.
I reload, the page, add a new collection type, but this time I leave the form field empty.
I click "submit". The component re-renders, and the Profiler shows me the Validation errors. The form field, however, does not reflect this. It simply renders a form field without errors (or any indication thereof).
When I loop over the errors in Twig:
I see the messages, e.g.:
For each of the fields that should have a value but don't actually show it.
In this example, with one field, I can show a generic error message saying; check the field because it's empty.
But as the embedded form is more complex, with multiple entries, it may get more difficult for the user to spot the field they forgot.
Do any of you have an idea how to get the individual fields to show the error on submitting an empty LiveCollectionType? :)