Allow accessing the JSONEditor instance from the outside, e.g. by attaching it to the DOM

[cb109]

• django-json-widget version: 1.1.1
• Django version: 2.2
• Python version: 3.7
• Operating System: Ubuntu 20.04

What I want to do

I am trying to customize the JSONEditor instance, namely I am trying to disable the Save button on the admin change page whenever invalid JSON is entered.

The jsoneditor comes with a onValidationError hook that would allow me to do this. I cannot configure it on the python side though, as the options dict is serialized. Which you mention:

Options that require functions (eg. onError) are not supported.

I can see the reasoning for this limitation. I would however be nice to be able to get a handle to the widget's JSONEditor instance in a template's script tag, so further customization can be done there.

Right now the editor instance is defined within an IIFE and there is no way to access it later:

(function() {
    ...
    var editor = new JSONEditor(container, options);
})();

The simplest way to be able to fetch that instance from the DOM would be by attaching it to the container as described in a similar ticket on the jsoneditor library itself. This would also support having multiple editors in the same template.

var editor = new JSONEditor(container, options);
container.jsoneditor = editor;

Then on the python-side I could define some attrs that make the container element selectable and just access the editor instance in some overriden admin template there and define custom callbacks etc. to improve the integration of the widget with my page.

Thanks for reading