availity-reactstrap-validation

availity-reactstrap-validation copied to clipboard

Hi i had input field which should not access leading and trailing slash. For this i have added a reg ex which does not allow leading/trailing slash. But in case if field is optional this validation is does not get applied and field allows space only.

<AvField type="text" id="ReportingCollectionName" name="ReportingCollectionName" helpMessage={Resource.Collection_If_Not_Exist} placeholder="Reporting container Name" value={this.state.values.ReportingCollectionName} onChange={this.handleChange.bind(this)}
                            validate={{
                                required: {value: true, errorMessage: `${Resource.MSG_Enter_Valid_Data} ${Resource.LBL_Collection_Name_for_Reporting}`},
                                pattern: {value: '^[A-Za-z0-9_-]+(?: +[A-Za-z0-9_-]+)*$', errorMessage: `${Resource.MSG_Enter_Valid_Data} ${Resource.LBL_Collection_Name_for_Reporting}`},
                            }}
                        />

Yes, if the field value is trimmed when determining if it is empty. Validation (other than required) do not apply to "empty" fields.

If you need a different validation, you can create a custom validation function Check out this example: https://stackblitz.com/edit/reactstrap-validation-v2-xpknkm?file=Example.js