2016-01-12 19:40:23 +08:00
<!DOCTYPE HTML>
< html >
< head >
2016-11-12 03:26:32 +08:00
< meta charset = "UTF-8" >
2016-10-28 15:36:05 +08:00
< title > JSON schema validation | JSONEditor< / title >
2016-01-12 19:40:23 +08:00
< script src = "../dist/jsoneditor.js" > < / script >
< style type = "text/css" >
body {
width: 600px;
font: 11pt sans-serif;
}
#jsoneditor {
width: 100%;
height: 500px;
}
< / style >
< / head >
< body >
< h1 > JSON schema validation< / h1 >
< p >
This example demonstrates JSON schema validation. The JSON object in this example must contain properties < code > firstName< / code > and < code > lastName< / code > , can can optionally have a property < code > age< / code > which must be a positive integer.
< / p >
< p >
See < a href = "http://json-schema.org/" target = "_blank" > http://json-schema.org/< / a > for more information.
< / p >
< div id = "jsoneditor" > < / div >
< script >
var schema = {
"title": "Example Schema",
"type": "object",
"properties": {
"firstName": {
"type": "string"
},
"lastName": {
"type": "string"
},
2016-01-15 04:10:30 +08:00
"gender": {
"enum": ["male", "female"]
},
2016-01-12 19:40:23 +08:00
"age": {
"description": "Age in years",
"type": "integer",
"minimum": 0
}
},
"required": ["firstName", "lastName"]
2016-10-28 17:46:46 +08:00
}
2016-01-12 19:40:23 +08:00
var json = {
firstName: 'John',
lastName: 'Doe',
2016-01-15 04:10:30 +08:00
gender: null,
age: 28
2016-10-28 17:46:46 +08:00
}
2016-01-12 19:40:23 +08:00
var options = {
2016-11-12 03:18:31 +08:00
modes: ['code', 'tree']
2016-10-28 17:46:46 +08:00
}
2016-01-12 19:40:23 +08:00
// create the editor
2016-10-28 17:46:46 +08:00
var container = document.getElementById('jsoneditor')
2016-11-12 03:18:31 +08:00
var editor = jsoneditor(container, options)
editor.setSchema(schema)
editor.set(json)
2016-01-12 19:40:23 +08:00
< / script >
< / body >
< / html >
