Form Validations on Submit (React)

Questions
1

Say a user clicks submit before entering values into certain fields. How can I trigger validations on all of the inputs before the submit completes?

Typically, HTML5 validations are clever enough to trigger the validations when the button is clicked, but this doesn’t seem to be happening with Framework 7 forms. Here’s a simple example.

<List form>
  <ListInput type="email" validate errorMessage="Please enter a valid email" />
  <ListInput type="password" validate errorMessage="Please enter a value" required />
  <Button>Submit</Button>
</List>

I tried using refs to trigger validateInput(), but that did nothing.

I also tried using refs to trigger blur on the HTML input directly, but I’m not sure how to get ahold of the input element that ListInput creates.

2 
<List form id="my-form">

in your submit handler:

const isValid = this.$f7.input.validateInputs('#my-form');
1 Like
3

Thanks! How would this work with custom validations using errorMessageForce?