| Availability |
Odoo Online
Odoo.sh
On Premise
|
| Lines of code | 499 |
| Technical Name |
json_char_display |
| License | LGPL-3 |
| Website | https://github.com/Lucas-l16 |
| Availability |
Odoo Online
Odoo.sh
On Premise
|
| Lines of code | 499 |
| Technical Name |
json_char_display |
| License | LGPL-3 |
| Website | https://github.com/Lucas-l16 |
JSON Char Display
A dedicated field widget for JSON strings stored in Char and Text fields. Displays data in a structured, indented format for better readability and easier debugging.
Key Features
Ready to use out of the box â enable human-readable JSON display with a single line of XML
Read-only formatted display
Valid JSON is shown in a Bootstrap card with monospace indentation. Invalid JSON is displayed with a warning while preserving the raw value â no data is lost.
Edit toolbar
Edit mode provides Format, Minify, and Validate actions for quick pretty-printing, compression, and syntax checking.
One-click copy
Copy formatted JSON directly in read-only mode, ready to paste into external tools or documentation.
List view preview
Shows a {...} badge and a summary of top-level keys in list views,
so you can identify JSON content without opening the form.
Smart dirty-state handling
Opening a form only applies display-layer formatting and does not mark the record as modified. The record is marked dirty only when the JSON content changes semantically.
Lightweight integration
Depends only on the web module. Pure frontend OWL field widget â
no Python model changes required; declare it in your view XML and you are done.
Configurable options
Customize indent size, read-only area max height, and whether to auto-format when entering edit mode.
Feature Screenshots
See how the widget presents valid and invalid JSON across Odoo views and field states
JSON values are summarized directly in list views, making records easier to scan without opening each form.
Well-formed JSON is shown with clear indentation and readable structure while editing records.
Invalid JSON remains visible with a clear warning, so users can diagnose syntax issues without losing the raw value.
Read-only fields keep valid JSON easy to inspect with formatted output and a clean display area.
Read-only invalid values are preserved and flagged, helping users understand data quality issues at a glance.
How to Use
Get started in three steps
Search for and install JSON Char Display from Apps, or install from the command line:
python odoo-bin -d <database> -i json_char_display
Add widget="json_char" to a Char or Text field
in your form or list view:
<field name="payload" widget="json_char"/>
After editing your view XML, upgrade the module and refresh your browser:
python odoo-bin -d <database> -u json_char_display
XML Examples
Typical usage in form and list views
<form>
<sheet>
<group>
<field name="name"/>
</group>
<group string="API Response">
<field name="payload"
widget="json_char"/>
</group>
</sheet>
</form>
<tree>
<field name="name"/>
<field name="payload" widget="json_char"/>
</tree>
options
<field name="payload"
widget="json_char"
options="{
'indent': 2,
'auto_format_on_edit': true,
'max_height': 400
}"/>
Configuration Options
Fine-tune widget behavior via the options attribute
| Option | Type | Default | Description |
|---|---|---|---|
indent |
Integer | 2 |
Number of spaces used when pretty-printing JSON |
auto_format_on_edit |
Boolean | true |
Whether to show formatted JSON in the textarea when entering edit mode (display only â not saved to the database) |
max_height |
Integer | 400 |
Maximum height of the JSON display area in read-only mode (pixels); a scrollbar appears when content exceeds this height |
Use Cases
API response storage
Raw JSON strings returned by third-party APIs
Debugging & troubleshooting
Quickly inspect configuration or log JSON during development
Integration settings
JSON configuration fields for webhooks, sync rules, and more
Legacy data compatibility
Existing Char/Text fields storing JSON â no field type migration required
Built-in Demo
The module includes a JSON Char Demo menu and sample records. After installation, you can try read-only display, the edit toolbar, and list view preview right away.
Note: remove the json.char.demo model and related demo data before deploying to production.
- Nested object JSON sample
- JSON array sample
- Invalid JSON graceful display sample
JSON Char Display
Widget: json_char
| Field types: char, text
| Depends on: web
Please log in to comment on this module