JSON editor
The JSON tab shows the entire view definition — the same JSON the application loads at runtime. Everything you configure visually is stored here; everything you type here appears in the visual editor.
When to use it
- Bulk edits — rename a value across many expressions with find & replace.
- Copying — move an element or a whole page between views.
- Fixing — resolve an odd state faster than clicking through properties.
- Reviewing — see exactly what will be handed to developers.
Structure at a glance
json
{
"settings": { "width": "1182", "language": "lt" },
"pages": [ { "name": "page1", "rows": [ { "columns": [ { "elementRef": "firstName" } ] } ] } ],
"elements": {
"page1": { "name": "page1", "label": "Page 1", "type": "page" },
"firstName": { "name": "firstName", "label": "First name", "type": "text", "required": true }
},
"dataSources": [ { "name": "loadCountries", "type": "rest", "params": { "url": "..." } } ],
"localization": { "defaultLanguage": "lt", "languages": ["lt"], "texts": {} }
}Key ideas:
pages[].rows[].columns[]describe layout; each column points at an element byelementRef.elementsis a flat map of every element's configuration, keyed by name.- Logic properties are plain strings:
"visibleIf": "{clientType} == \"company\"".
Full field-by-field reference: Structure JSON (developer docs).
Safety
- The editor validates JSON as you type — syntax errors are flagged before they can break the view.
- An element referenced in
rowsmust exist inelements(and vice versa) — keep both sides in sync when hand-editing. - Copy the whole JSON to a scratch file before large manual edits.
