question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

onChange mode doesn't work with array of objects

See original GitHub issue

Hello,

onChange mode doesn’t work with array of objects. It only validates on submit. For example, on the code below, location is validaded correctly as soon as I type anything but the array of persons doesnt fire up validation while I type anything. It only shows me validation erros when I submit. Any clues? Regards

const schema = yup.object().shape({
    location: yup.string().required().min(4),
    persons: yup
        .array()
        .required()
        .of(
            yup.object().shape({
                name: yup.string().required().min(4),
            })
        )
});

const { register, errors, handleSubmit } = useForm({
      mode: 'onChange',
      validationSchema: schema
});


<div className="form-group input-sm">
	<div className={"col-sm-12 " + (errors["persons[0].name"] ? 'has-error' : '')}>
		<input type="text" className="form-control" placeholder="name" name="persons[0][name]" 
			   ref={register}/>
		{errors["persons[0].name"] ? (<div>
			<span className="form-control-feedback" aria-hidden="true"><i className="fa fa-remove"></i></span>
			<span className="help-block">{errors["persons[0].name"].message}</span>
		</div>) : ''}
	</div>
</div>

Issue Analytics

  • State:closed
  • Created 4 years ago
  • Comments:8 (5 by maintainers)

github_iconTop GitHub Comments

1reaction
dextervipcommented, Oct 11, 2019

@bluebill1049 Okay! thank for your support!

0reactions
bluebill1049commented, Oct 11, 2019

no worries @dextervip

Read more comments on GitHub >

github_iconTop Results From Across the Web

How do I update states `onChange` in an array of object in ...
I have seen examples on people updating the state for property in array, but never for state in an array of object, so...
Read more >
How To Update State onChange in an Array of Objects using ...
To update the state in an array of objects when the change occurs (onChange). We will create an array and store it inside...
Read more >
HTML onchange Attribute - W3Schools
Definition and Usage. The onchange attribute fires the moment when the value of the element is changed. Tip: This event is similar to...
Read more >
Documentation - SolidJS · Reactive Javascript Library
The createSignal function returns a pair of functions as a two-element array: a getter (or accessor) and a setter. In typical use, you...
Read more >
ASP.NET Core Blazor data binding - Microsoft Learn
The @onchange event provides an array of the selected elements via event ... The Blazor framework doesn't attempt to suppress the default ...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found