Allow custom rendering of fields and values #738
Description
This topic is (indirectly) discussed here and there already. This is an explicit issue to address this feature.
It would be great to allow custom rendering of both the field (property) and values. That would allow you for example to:
- Render a JSON schema title instead of the property name in a form (Upgrade to ajv@6 #635 (comment))
- Render your own dropdown or HTML output, render a map when having a geolocation, render a date picker or stuff like that in certain cases, etc.
The API and usage could look something like:
onRenderValue({ path, field, value, schema, onChange }) => {
const html = document.createElement('INPUT')
html.value = value
html.onchange = function (event) {
onChange(event.target.value)
}
return {
html,
update: (value) => {
html.value = value
},
destroy: () => {
// clean up any instantiated DOM stuff if needed
}
}
}
// onRenderField similar to onRenderValue