Force to show invalid-feedback in Bootstrap 4

Use display classes to display it manually for example d-block

use it like so

<div class="valid-feedback d-block">

<div class="invalid-feedback d-block">

Find more in documentation

There are better ways.

1) Look into a was-validated class, that you can set on the form like so

<form action="..." class="was-validated" method="POST" novalidate>

When set on the form it displays validation feedback and also colorcodes the input field.

Just add it conditionally on your form, when validation failed on the server side.

2) Or you can use some JavaScript to be in control of what is displayed. You can add this class dynamically

$('form').addClass('was-validated');

and you can also dynamically check if the form is valid like so

 if ($('form').checkValidity()) {...

Related