Expected behavior To show the invalid feedback text for a hidden type input

Actual behavior Nothing happens.

Resources (screenshots, code snippets etc.)

 export default function Form(props) {

function submit(e)
{
    e.preventDefault();
    e.target.className += " was-validated";

}

return(
<>

 <form  className="needs-validation" onSubmit={e=> submit(e)} noValidate>
            <input type="hidden" min="1" max="1" name="hiddenField"  value="0"
                id="defaultFormRegisterNameEx"
                className="form-control"
                required
              />
              <div className="invalid-feedback">Please have valid value</div>
            <MDBBtn type="submit">Submit</MDBBtn>
</form>
</>
);
}