Updated history and example. Fixed bottom margin of submenu

This commit is contained in:
jos 2017-05-07 15:32:31 +02:00
parent 913af51aab
commit 0ddc9407b0
3 changed files with 37 additions and 18 deletions

View File

@ -3,6 +3,11 @@
https://github.com/josdejong/jsoneditor
## not yet released, version 5.7.0
- Implemented support for template items. Thanks @israelito3000.
## 2017-04-15, version 5.6.0
- Implemented readonly option for modes `text` and `code.`

View File

@ -1,7 +1,7 @@
<!DOCTYPE HTML>
<html>
<head>
<title>JSONEditor | JSON schema validation</title>
<title>JSONEditor | Item templates</title>
<link href="../dist/jsoneditor.css" rel="stylesheet" type="text/css">
<script src="../dist/jsoneditor.js"></script>
@ -19,33 +19,42 @@
</style>
</head>
<body>
<h1>JSON schema validation</h1>
<h1>Item templates</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.
Using item templates, the options in the context menu under "insert" and "append" can be extended with extra options, containing a domain specific template like a "Person", "Contact", "Order", "Address", etc.
</p>
<div id="jsoneditor"></div>
<script>
var json = {
var json = [
{
firstName: 'John',
lastName: 'Doe',
gender: null,
age: 28
};
}
];
var options = {
templates: [
{
"menu": "Special Node",
"name": "SpecialNode",
"data": {
"field1": "value1",
"field2": "value2"
menu: 'Person',
name: 'PersonTemplate',
data: {
'firstName': 'John',
'lastName': 'Do',
'age': 28
}
},
{
menu: 'Address',
name: 'AddressTemplate',
data: {
'street': "",
'city': "",
'state': "",
'ZIP code': ""
}
}
]
@ -54,6 +63,7 @@
// create the editor
var container = document.getElementById('jsoneditor');
var editor = new JSONEditor(container, options, json);
editor.expandAll();
</script>
</body>
</html>

View File

@ -321,7 +321,11 @@ ContextMenu.prototype._onExpandItem = function (domItem) {
var height = ul.clientHeight; // force a reflow in Firefox
setTimeout(function () {
if (me.expandedItem == domItem) {
ul.style.height = (ul.childNodes.length * 24) + 'px';
var childsHeight = 0;
for (var i = 0; i < ul.childNodes.length; i++) {
childsHeight += ul.childNodes[i].clientHeight;
}
ul.style.height = childsHeight + 'px';
ul.style.padding = '5px 10px';
}
}, 0);