I am using react-jsonschema-form to dynamically generate form fields. I am using this to generate only few additional fields in a form. Therefore I'm not using submit function in react-jsonschema-form. Instead I submit generated field values also with my form.
I am using this state hook to store the values of updated properites
const [additionalData, setAdditionalData] = useState("")
What I want to do is update value of additionalData from onChange in react-jsonschema-form.
function getTemplateFields(data: string) {
const json = JSON.parse(data)
const log = (type: string) => console.log.bind(console, type);
return <div>
{json &&
<Form schema={json}
onChange={e => {
setAdditionalData(e.schema.properties) // something like this
}}
children={true} // hide submit button
onError={log("errors")}/>
}
</div>
}
But I cannot get the update field values from event. Can someone help me with this.
According to documentation the first argument of onChange
function is a result object having a formData
attribute. So to get access to event you should do something like:
onChange={({ formData }, e) => {
setAdditionalData(e.schema.properties);
}}