Generate Form from JSON Schema

Question

I want to generate an HTML form based on an existing JSON Schema. I wanted to know if there was a field type key that was standardized on a property so that when I loop over the schema I can determine what field type to render.

The current solution I have which keys in on if it is a "type": "string" feels really hairy because in some cases the schema is storing URLs as strings which for the form would mean a input of type='file' . So I think I need some sort of meta property but don't want to pollute the schema unnecessarily.

Has anyone run into anything like this before and is there any standard properties for this problem?

Answer 1

JSON schema does not provide a mapping to HTML forms in spec, you can combine type and format to cover some cases. For example

{"type": "string", "format": "uri"}

can be used to validate an URL.

However JSON Schema is extensible and some implementations provide features beyond the spec. You can check a very nice HTML form mapping implementation: https://github.com/mozilla-services/react-jsonschema-form .

You can specify <input type="file" /> with "format": "data-url" , which is not part of JSON schema spec, but is a custom extension provided by implementation.

Demo: https://mozilla-services.github.io/react-jsonschema-form/