Questions tagged [yup]
Yup is a JavaScript object schema validator and object parser based on Joi
1,235
questions
0
votes
1
answer
26
views
Yup validation with dynamic keys in an object
I have an object for validation that might look like this:
const exampleObject = {
foo: {
entries: {
'785bac64-c6ce-4878-bfb8-9cf5b32e2438': {
name: 'First object',
},
'...
0
votes
0
answers
11
views
Yup validate condition based on other fields
Imagine I have a form that has 3 input fields:
interface FormType {
registerDate: boolean;
fromDate: Date;
toDate: Date;
}
When registerDate is true, both fromDate and toDate is required. Also, ...
0
votes
0
answers
13
views
How can I inspect or query a Yup Schema?
I am creating a form library using React + Material UI + react-hook-form + yup. One of the parameters of my component is a yup schema to validate the form values.
Depending on the yup schema ...
0
votes
0
answers
14
views
How to check for this validation with Yup
[{id: 1, name: "", surname:""},{id: 2, name: "", surname:""}] false
[{id: 1, name: "John", surname:"Doe"},{id: 2, name: "", ...
0
votes
1
answer
41
views
Perform function after form validation
I am using react, typescript, and Email JS library. I am using the react-hook-form library and yup to validate forms.
I have worked out the validation and sending the email, but I am unable to do both ...
0
votes
1
answer
10
views
How to set value in MUI Select on onChange in Formik?
I was facing some challenges while integrating Formik with the Select component of MUI, firstly, it didn't change the value on the onChange event and also was not showing any error messages , if I ...
0
votes
0
answers
24
views
Yup Validation deep nested schema, how deep?
I seem to be having issues with a schema that is nested 3 levels deep. I recall reading somewhere that yup only supports 2 levels. Can some one confirm this.
note the empty below
"...
0
votes
1
answer
27
views
Yup dynamic object validation
I am sending a value to yupa via formik. As a result of this value, what can I do to make the necessary checks and return an error message in this style? Since the object has unlimited length, I ...
0
votes
2
answers
40
views
react-hook-form yup schema useFieldArray validation error message not go away
I want to validate the dynamic form I made using react-hook-form useFieldArray with yup resolver.
This is how I set up my schema.
const schema = yup.object().shape({
type_of_transports_details: ...
0
votes
0
answers
20
views
error message in Formik validation in Autocomplete (Material UI) persists even if Yup.required is fulfilled
Validation error persists in Autocomplete component. I'm using formik for form handling and validation. For other textfield component, it works fine. Here is the snippet of my component.
const ...
0
votes
0
answers
28
views
Yup ValidationSchema Type with ObjectSchema Not Working
yup 0.30.0
@types/yup 0.29.14
I'm trying to generate a reusable type definition for a Yup validationSchema by using ObjectSchema but I keep getting an error
Using an example from the Yup docs here
...
0
votes
1
answer
32
views
Yup Infertype doesn't work for optional fields
Hi yup's Infertype doesn't work properly for optional fields.
const userSchema = yup.object({
name: yup.string().required(),
age: yup.number().required().positive().integer(),
email: yup.string()...
0
votes
1
answer
19
views
Make yup validate differently depending on what function I call
https://codesandbox.io/s/nice-cohen-k3kdtq?file=/src/App.js Here is the codesandbox example of my code
What I need to do is when I click the 'Preview' button I want to disable validation on last two ...
0
votes
0
answers
13
views
Formik Yup custom validation Message
I have a form of two inputs where as the second field is dependent on the first field value.
I would like to get a value from the first first and say it like
the value should be between 1 and #first ...
0
votes
0
answers
15
views
how to get a Yup object value dependent on another object value
I have a Yup object shape which has a field called employee job title.
I have another Yup object shape which is called license number.
Both of the above object are in 1 main object shape :
main object:...
2
votes
1
answer
132
views
React Hook Form Property 'type' is missing in type 'Merge<FieldError, FieldErrorsImpl<DeepRequired<any>>>' but required in type 'FieldError'
I'm building an Next.js application using TypeScript, TailwindCSS, ReactHookForm and Yup.
Everything is working fine, it validates, throws and displays the error as expected, but I'm getting a typing ...
0
votes
0
answers
17
views
Material AutoComplete and Yup Not Detecting Set Value
I have a TextField wrapped in AutoComplete component. The TextField input validation is managed by Yup.
<Autocomplete
id={'select-city-id'}
options={City.getCitiesOfState('US', ...
0
votes
0
answers
15
views
Yup Validation conditionally in react
If minTenure and maxtenure value is available then validate it as required field and the value should be equal to or between mintenure and maxTenure, else make it mandatory with any integer value in ...
0
votes
0
answers
24
views
Why is my submit value empty when I use useState (React)?
Hey I am currently working on changing an input value to always have 2 decimal points using toFixed(2) but for some reason my yup validation are not recognizing the input. I'm using mui InputField and ...
0
votes
1
answer
23
views
Yup how to validate mandatory fields on null object and with same Object
I have a problem regarding the validation of mandatory fields which are properties of a (possibly) null object.
Here is an example schema :
initialValues={{
employee: null,
...
1
vote
1
answer
35
views
Yup: how to compare one field with other? Ref neither parent.field not working
This is the yup schema:
let schema = yup.object().shape({
password: yup.string().required('Enter password'),
confirm: yup.string().required('Re-enter password')
....
0
votes
1
answer
27
views
Formik form input not accepting decimal number
Here is my complete edit form. I am type checking with prop types. Also using yup for validation with formik. However my input field is not accepting decimal number. Do i need to add custom validation ...
0
votes
1
answer
24
views
React JS Yup + Formik trigger function with every validation
I'm using Formik with Yup for validation, using the useFormik() hook, like this:
const formik = useFormik({
initialValues,
validationSchema: yup.object({
password: yup
...
0
votes
2
answers
34
views
can we validate different input fields on value change of first input fields in yup
Hello Stackoverflow Family,
I have a question related to Yup, I have one select Input fields and it have 4 items on it's forth items it add two more input fields. is it possible i can apply validation ...
0
votes
2
answers
40
views
validate input based on checkbox
I have an input and a checkbox. You can write in the input and submit which will submit correct data. You can disable the input by clicking on the checkbox and it will submit null value which is what ...
0
votes
0
answers
8
views
In select tag the error is showing after clicking on submit button
const validationSchema = Yup.object().shape({
timezone: Yup.string().required('Required'),
userdescription: Yup.string().min(2, 'Too Short!').max(100, 'Too Long!').required('Required'),
email: Yup....
0
votes
0
answers
18
views
Yup argument not assignable to parameter of type ObjectShape
So I'm trying to create yup validation with DTOs.
I get two errors:
Yup argument is not assignable to parameter of type ObjectShape
Property id is not assignable to index signature. Type number is ...
2
votes
0
answers
34
views
Conditional Validation in Yup Formik React
I am trying to add conditional validations for a field that exists is a part of one form but is not for the other.
This is my custom validation of yup.
export const validationSchema = Yup.object({
...
0
votes
0
answers
21
views
Yup Validation isn't working with React JS
I want a YUP validation to check if the user id already exists in the database or not.
I have written it like this :-
userName: Yup.string()
.required("You must enter the User ID")
.test(...
0
votes
0
answers
21
views
React, MUI + Formik lag on scroll
I'm currently in the process of creating a simple form using MUI TextFields, Formik and some Yup validation.
I ran into some issues with performance with lower spec devices when scrolling and I have ...
0
votes
1
answer
45
views
How to disable a submit button until all the YUP fields are validated and enabled it without clicking outside the input field?
photo of the bug
I have this react component:
import { FC, FormEventHandler } from 'react';
import { useForm } from 'react-hook-form';
import { yupResolver } from '@hookform/resolvers/yup';
import * ...
0
votes
0
answers
17
views
setFieldValue in Formik not working correctly on cancel
I have two components. My Formik initial values are in the MyDetails component. I have a form in NewDetailsForm. I am trying to set a default value to material UI select (identityType field in ...
0
votes
1
answer
38
views
matches yup zip code validate problem with antd form and react-hook-form
I'm currently new to yup and I'm working on a project that need to validate zip+4 format, my yup schema for zip validation is like this
zip: yup
.string()
.required('Please enter your zip')
...
0
votes
1
answer
29
views
yup validation 2 of 3 inputs required
I have yup validation in my form. I want to validate if user compleate minimum 2 of 3 inputs. When user not compleate i want change only a color of text to red. How can i setup my schema to do that. ...
0
votes
0
answers
92
views
Is it possible to pass both custom validation function in validate and do yup/zod schema validation in React-hook-form
Is it possible to execute both custom validation function which will be passed to validate object in react hook form and yup/ zod schema validation ?
I have a custom rules object from where I would ...
0
votes
1
answer
67
views
Change css when yup validate input
I have this Formik Form with Yup validation :
<Form>
<div className="mt-3">
<label className="font-semibold">Nom</label>
<Field className=...
1
vote
1
answer
36
views
get current value on yup when condition
I have two date fields, start date, and end date. I would like to know how to set up a validation not to accept the start date to be higher than the end date and vice-versa.
Reading the yup ...
0
votes
0
answers
33
views
Form validation error not displayed immediately upon detection
I have a list of entities all of which are arranged in a virtualized list sporting 2 required Textfields and a submit button each. (I followed the example provided here).
In useForm() I set the ...
1
vote
0
answers
45
views
Formik Yup not working properly `.test()` custom validation setting for one input impact all others input
so i have this schema validation :
const validationSchema = Yup.object().shape({
username: Yup.string()
.min(2, 'votre surnom doit contenir minimum 2 caractères')
.max(30, '30 ...
1
vote
1
answer
65
views
check email id already exists with using yup validation wrrong url how change setting
i try to use formik form with yup validation to see if a email already exist in database (i have a nestjs back on the port 8000 and my react front on the port 3000) so i do this:
const ...
0
votes
1
answer
122
views
Yup and Formik not validating form when testing with Jest and React Testing Library
I recently updated Jest to it's latest 28. version and my unit tests stopped working, particularly on tests that validated my form with Yup and Formik and showed the error messages. If I rollback the ...
1
vote
1
answer
49
views
Yup. How to change error message text date
How to change message text for date field:
date must be a date type, but the final value was: Invalid Date
Now scheema looks like this:
let scheema= yup.object().shape({
date: yup.date()
...
1
vote
1
answer
24
views
Using when with objects in array in Yup
I have the following object:
const values = {
people: [
{
name: "Mark",
age: null
},
{
name: "Shark",
age: 31
}
],
isAgeRequired: ...
0
votes
0
answers
67
views
Make typescript require certain fields in yup validation schema based on requiredFields array
Analyze this fragment of code:
export const enum ObjectType {
Tree,
}
export type EnumDictionary<T extends string | symbol | number, U> = {
[K in T]: U;
};
export const ...
0
votes
0
answers
32
views
YUP NODE JS flat dictionary object validation
I have a form data like this
labels: { 'EN-US': 'foo bar', 'EN-BR': 'foo baz' }
How to validate it through YUP? where there are no names for the Object while I searched a lot to create object names ...
1
vote
1
answer
35
views
Yup and Formik - how to set variables for different conditions on password field
I have been searching through other posts and finding issues similar to but not quite what I am looking for.
I need to know simultaneously if the different conditions are met for a password to ...
0
votes
1
answer
30
views
Error while validating form using yup in react-native
I am creating a form using formik and have completed making the UI but when I want to validate the form using yup I get the error as yup.string().firstname is not a function.(In 'yup.string()....
0
votes
1
answer
164
views
How to validate using oneOf with yup
I have what I thought was a simple validation using oneOf that isn't working for me with yup:
const schema = Yup.mixed()
.oneOf([
{
error: `EmailOrPasswordInvalid`,
},
{},
])
....
0
votes
0
answers
20
views
Yup validation showing error when the textinput field value is set
This is the error when i click my location the location value is set. But the error is not going.
<FormField
maxLength={50}
name="location"
placeholder="Location"
...
0
votes
0
answers
23
views
How can I specify a Yup error on a validating field's parent schema?
I'm trying to set up a validation schema to use with Formik. I have a combobox that has items of shape { id: number; value: string; } and pulls the value out to display to the user, while submitting ...