josdejong / josdejong/jsoneditor

Allow custom rendering of fields and values

Open
#738 8 comments 4 reactions 0 assignees View on GitHub
feature help wanted
Dominant language
JavaScript
Stars
12.3k
Forks
2.1k
PR merge metrics
No merged PRs in 30d

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 (https://github.com/josdejong/jsoneditor/issues/635#issuecomment-508987312)
- 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:

```js
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
```

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.