0

I'm doing the cakephp 5 cms tutorial and I want to use Boostrap 5 form validation.

But I see that the Form Helper does not render the div with error messages for the field’s required and notBlank before submitting the form, that is; Only the div with the error message is rendered after submitting the form and returning me to the view of my form.

Form before send (Not showing the validation error message)

Form before send (Not showing the validation error message)

Form after sent and redirect to form view

Form after sent and redirect to form view

By default the Form Helper creates the input HTML element as follow.

`<?php echo $this->Form->control('title', ['required']); ?>`

output: <input name="title" type="text" required>

Modify the Form Helper template to show a div class="invalid-feedback" in the inputContainer and it is already rendered before submitting the form, but the div is empty without the error message.

/vendor/cakephp/cakephp/src/View/Helper/FormHelper.php

`error' => 'My custom error message'`
`'inputContainer' => '<div class="input {{type}}{{required}}">{{content}}<div class="invalid-feedback">{{error}}</div></div>'`

Actually my Form input is shown as follows after modifying the Form Helper:

`<div class="mb-3 form-group text required">
    <label class="form-label" for="title">Title</label>
    <input type="text" name="title" required class="form-control">
    <div class="invalid-feedback"></div>
</div>`

I want the input to be displayed as follows before submitting the form:

`<div class="mb-3 form-group text required">
    <label class="form-label" for="title">Title</label>
    <input type="text" name="title" required class="form-control">
    <div class="invalid-feedback">My custom error message</div>
</div>`

How can I include the error validation message inside my div class="invalid-feedback" before submitting the form?

I want it to be generated this way from the Form helper since I am going to generate the forms with Bake Console.

Is there a way to make this possible?

I'm using the Cakephp 5 version 5.0.8

I hope anyone can help me please. Thank you.

3
  • To be clear, you want to tell the user that they've done something wrong, before they have done anything at all? If so, I think that setting the error in the new entity object your controller creates to send to the view would do the trick. $entity->setError('fieldName', 'Error message'); Commented Jun 14, 2024 at 12:52
  • Hi Greg. I want to show a dynamic validation like a Boostrap 5 form, that is, if a required field is empty and the user presses the save button, a validation message is displayed for that field but without sending the form yet, and if he fills the field then the validation message is hidden. Commented Jun 14, 2024 at 17:51
  • The problem I have with cakephp's native validation messages is that users get confused, since when redirecting to the form and displaying the error messages, when the required field or some other simple html5 validation is filled out, the user thinks that The filling of the field is still incorrect since the field is still red and the error message is not hidden. Commented Jun 14, 2024 at 17:52

0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.