Methods

Jedison provides several methods to interact with your editor instance:

getValue()

Returns the current value of the editor by calling getValue() on the root instance.

Internally, this traverses the entire instance tree to build the complete JSON structure.

const jedison = new Jedison.Create({
  schema: {
    type: 'object',
    properties: {
      name: { type: 'string' },
      age: { type: 'integer' }
    }
  },
  data: { name: 'Ada', age: 30 }
})

console.log(jedison.getValue())
// { name: 'Ada', age: 30 }

setValue(data)

Updates the editor's value with new data by calling setValue() on the root instance.

  • data: The new JSON data to set
const jedison = new Jedison.Create({
  schema: {
    type: 'object',
    properties: {
      name: { type: 'string' },
      age: { type: 'integer' }
    }
  }
})

jedison.setValue({ name: 'Grace', age: 34 })

console.log(jedison.getValue())
// { name: 'Grace', age: 34 }

getInstance(path)

Retrieves a specific instance by its JSON Pointer.

Example paths:

  • '#' - Root instance
  • '#/property' - Nested property
  • '#/array/0' - First item in an array
const jedison = new Jedison.Create({
  schema: {
    type: 'object',
    properties: {
      address: {
        type: 'object',
        properties: {
          street: { type: 'string' }
        }
      }
    }
  }
})

const streetInstance = jedison.getInstance('#/address/street')
console.log(streetInstance.getValue())

Programmatic Array Control

Every array instance retrieved via getInstance(path) exposes methods to add, remove, and reorder items directly, without going through the UI:

  • move(fromIndex, toIndex, initiator) - Moves an item from one index to another
  • addItem(initiator) - Appends a new item using the schema's default value
  • addItemAfter(afterIndex, initiator) - Inserts a new item right after the given index
  • deleteItem(itemIndex, initiator) - Removes the item at the given index

initiator is optional and defaults to 'api'. These are the same methods the UI's own add/delete/move buttons call internally, so they fire the same item-add/item-delete/item-move events documented on the Events page.

const jedison = new Jedison.Create({
  schema: {
    type: 'object',
    properties: {
      tags: {
        type: 'array',
        items: { type: 'string' }
      }
    }
  }
})

const tagsInstance = jedison.getInstance('#/tags')

tagsInstance.addItem()
tagsInstance.addItemAfter(0)
tagsInstance.move(2, 0)
tagsInstance.deleteItem(1)

showValidationErrors(errorsList = null)

Displays validation errors in the respective editors.

  • If errorsList is provided, displays those specific errors
  • Otherwise, shows all current validation errors from getErrors()
<form novalidate>
  <div id="jedison-container"></div>
  <button type="submit">Submit</button>
</form>

<script type="module">
  const jedison = new Jedison.Create({
    container: document.getElementById('jedison-container'),
    theme: new Jedison.Theme(),
    schema: {
      type: 'object',
      required: ['name'],
      properties: {
        name: { type: 'string' }
      }
    }
  })

  document.querySelector('form').addEventListener('submit', (event) => {
    event.preventDefault()
    jedison.showValidationErrors()
  })
</script>

getErrors(filters = ['error'])

Returns an array of validation error messages from all instances.

  • filters: Include only errors with type that are included in the filter array
jedison.getErrors(['error', 'warning'])
[
  {
    "type": "error",
    "path": "#",
    "constraint": "minLength",
    "messages": [
      "Must be at least 4 characters long."
    ]
  },
  {
    "type": "warning",
    "path": "#",
    "constraint": "x-my-constraint",
    "messages": [
      "Value should be equal to \"test\"."
    ]
  }
]
jedison.getErrors(['error'])
[
  {
    "type": "error",
    "path": "#",
    "constraint": "minLength",
    "messages": [
      "Must be at least 4 characters long."
    ]
  }
]

disable()

Disables UI controls

jedison.disable()

enable()

Enables UI controls

jedison.enable()

destroy()

Cleans up the editor instance by:

  • Calling destroy() on the root instance
  • Clearing the container HTML if in editor mode
  • Removing all instance references
const jedison = new Jedison.Create({
  container: document.getElementById('jedison-container'),
  theme: new Jedison.Theme(),
  schema: { type: 'object', properties: { name: { type: 'string' } } }
})

jedison.destroy()

Navigates to a specific field by path, activating all ancestor nav and categories tabs as needed.

  • path: A JSON Pointer path string (e.g. '#/organization/departments/1/teams/1')

Only works when Jedison is used as an editor (i.e. a container is provided).

const jedison = new Jedison.Create({
  container: document.getElementById('jedison-container'),
  theme: new Jedison.Theme(),
  schema: {
    type: 'object',
    'x-format': 'nav-vertical',
    properties: {
      organization: {
        type: 'object',
        'x-format': 'nav-vertical',
        properties: {
          name: { type: 'string' }
        }
      }
    }
  }
})

jedison.navigateTo('#/organization/name')