django-jsonfield-formatter 0.1.0

JSONEditor-based widget for Django admin JSONField with tree/code/view modes.

django-jsonfield-formatter

Installable Django app that replaces the default admin widget for JSONField with JSONEditor (tree, code, and view modes, search, navigation bar, and prettified editing).

Requirements

• Python 3.10+
• Django 4.2+

Install

pip install django-jsonfield-formatter

Or from a checkout:

pip install -e .

Setup

1. Add the app to INSTALLED_APPS:

INSTALLED_APPS = [
    # ...
    "jsonfield_formatter",
]

2. Run collectstatic in production so jsoneditor.min.js, jsoneditor.min.css, and icons are available.

Usage in the admin

Option A — formfield_overrides

from django.contrib import admin
from django.db.models import JSONField

from jsonfield_formatter.widgets import JSONFormatterWidget


@admin.register(MyModel)
class MyModelAdmin(admin.ModelAdmin):
    formfield_overrides = {
        JSONField: {"widget": JSONFormatterWidget},
    }

Option B — mixin

from django.contrib import admin

from jsonfield_formatter.admin import JSONFormatterAdminMixin


@admin.register(MyModel)
class MyModelAdmin(JSONFormatterAdminMixin, admin.ModelAdmin):
    pass

If you already use formfield_overrides, merge JSONField into your dict instead of using the mixin.

Widget options

JSONFormatterWidget accepts:

Argument	Description
attrs	Extra HTML attributes for the textarea (e.g. class).
mode	Initial mode: tree, code, or view (default tree).
height	CSS height for the editor area (default 400px).
editor_options	Dict merged into JSONEditor’s options (see JSONEditor API).

Example:

JSONFormatterWidget(
    mode="code",
    height="min(60vh, 520px)",
    editor_options={"sortObjectKeys": True},
)

Bundled JSONEditor version

Static files are vendored from jsoneditor 10.1.0 (see jsonfield_formatter/widgets.py).

Development

python -m venv .venv
source .venv/bin/activate
pip install -e ".[dev]"
pytest