Below is the editor generated from the JSON Schema.
Direct Link (preserves schema, value, and options)
JSON Output
You can also make changes to the JSON here and set the value in the editor by clicking
Options
Validation
This will update whenever the form changes to show validation errors if there are any.
Schema
You can change the schema and see how the generated form looks. After you make changes, click
Code
// Set default options
JSONEditor.defaults.options.theme = 'bootstrap2';
// Initialize the editor
var editor = new JSONEditor(document.getElementById("editor_holder"),{
schema: {
type: "object",
properties: {
name: { "type": "string" }
}
}
});
// Set the value
editor.setValue({
name: "John Smith"
});
// Get the value
var data = editor.getValue();
console.log(data.name); // "John Smith"
// Validate
var errors = editor.validate();
if(errors.length) {
// Not valid
}
// Listen for changes
editor.on("change", function() {
// Do something...
});