Open aenyway opened 3 years ago
Hi,
there is an error in your library when validating min/max or minLength/maxLength values set to 0. For reproduction you can use your first example of https://availity.github.io/availity-reactstrap-validation/components/validators/. Just change the minLength or maxLength values in the inputs validate attribute to 0.
The rendered input then get as minLength or maxLength attribute an object, which then breaks the validation. Same goes for min/max at number inputs, where also the native range limitation will not work anymore.
So <AvField name="name" label="Name (default error message)" type="text" errorMessage="Invalid name" validate={{ required: {value: true}, pattern: {value: '^[A-Za-z0-9]+$'}, minLength: {value: 0}, maxLength: {value: 0} }} />
<AvField name="name" label="Name (default error message)" type="text" errorMessage="Invalid name" validate={{ required: {value: true}, pattern: {value: '^[A-Za-z0-9]+$'}, minLength: {value: 0}, maxLength: {value: 0} }} />
will render to <input name="name" required="" pattern="^[A-Za-z0-9]+$" minlength="[object Object]" maxlength="[object Object]" id="name" type="text" class="is-touched is-pristine av-invalid is-invalid form-control" value="">
<input name="name" required="" pattern="^[A-Za-z0-9]+$" minlength="[object Object]" maxlength="[object Object]" id="name" type="text" class="is-touched is-pristine av-invalid is-invalid form-control" value="">
Thx.
Hi,
there is an error in your library when validating min/max or minLength/maxLength values set to 0. For reproduction you can use your first example of https://availity.github.io/availity-reactstrap-validation/components/validators/. Just change the minLength or maxLength values in the inputs validate attribute to 0.
The rendered input then get as minLength or maxLength attribute an object, which then breaks the validation. Same goes for min/max at number inputs, where also the native range limitation will not work anymore.
So
<AvField name="name" label="Name (default error message)" type="text" errorMessage="Invalid name" validate={{ required: {value: true}, pattern: {value: '^[A-Za-z0-9]+$'}, minLength: {value: 0}, maxLength: {value: 0} }} />will render to
<input name="name" required="" pattern="^[A-Za-z0-9]+$" minlength="[object Object]" maxlength="[object Object]" id="name" type="text" class="is-touched is-pristine av-invalid is-invalid form-control" value="">Thx.