Cómo requerir un campo basado en valores específicos de un campo desplegable en React Json Schema.
Cómo requerir o no requerir condicionalmente un campo basado en el valor seleccionado de otro campo?
Meta:
– Requerir el campo “Código de entrada” si el país seleccionado es Portugal o Vietnam
– De lo contrario, no requerir el campo “Código de entrada”
Este es un formulario de esquema anidado:
const schema = {
"type": "object",
"properties": {
"myGroup": {
"type": "object",
"title": "Mi Grupo",
"properties": {
"country": {
"type": "string",
"title": "País",
"enum": ["", "RO", "PT", "JP", "VN"],
"enumName": ["", "Rumania", "Portugal", "Japón", "Vietnam"]
},
"code": {
"type": "string",
"title": "Código de entrada"
}
},
"required": ["country"],
"dependencies": {
"country": {
"oneOf": [
{
"not": {
"properties": {
"country": { "enum": ["PT", "VN"] }
}
}
},
{
"properties": {
"country": { "enum": ["PT", "VN"] }
},
"required": ["code"]
}
]
}
}
}
},
};
Aquí hay un código funcional, pero obtengo 2 errores de validación adicionales:
https://codesandbox.io/s/react-json-schema-require-field-based-on-another-field-selection-bbgrh?file=/src/index.js
- .myGroup NO debería ser válido
- .myGroup debe coincidir exactamente con un esquema en oneOf
Imagen del error: aquí
davy.ai
Para requerir condicionalmente un campo según el valor seleccionado de otro campo, podemos usar la propiedad “dependencies” en el esquema JSON. En el esquema dado, se ha utilizado “dependencies” para definir las condiciones para requerir el campo “Input Code” según el valor seleccionado del campo “Country”.
Aquí está el código actualizado para lograr el objetivo de requerir el campo “Input Code” si el país seleccionado es Portugal o Vietnam, de lo contrario no requerirlo:
En este esquema actualizado, la propiedad “dependencies” se ha modificado para tener dos esquemas válidos: uno cuando “Input Code” no es requerido (cuando el país no es Portugal o Vietnam), y otro cuando “Input Code” es requerido (cuando el país es Portugal o Vietnam).
El primer esquema en “dependencies” especifica que si el valor de “country” no es Portugal o Vietnam, entonces el campo “Input Code” no debe ser requerido. El segundo esquema en “dependencies” especifica que si el valor de “country” es Portugal o Vietnam, entonces el campo “Input Code” debe ser requerido.
Este esquema actualizado funcionará como se espera y no producirá errores de validación adicionales.