9.4.1 • Published 13 days ago

jsoneditor v9.4.1

Weekly downloads
93,378
License
Apache-2.0
Repository
github
Last release
13 days ago

JSON Editor

Version Downloads Maintenance License FOSSA Status

JSON Editor is a web-based tool to view, edit, format, and validate JSON. It has various modes such as a tree editor, a code editor, and a plain text editor.

The editor can be used as a component in your own web application. The library can be loaded as CommonJS module, AMD module, or as a regular javascript file.

Supported browsers: Chrome, Firefox, Safari, Opera, Edge, Internet Explorer 11.

 

Cross browser testing for JSONEditor is generously provided by BrowserStack

Features

JSONEditor has various modes, with the following features.

Tree mode

  • Change, add, move, remove, and duplicate fields and values.
  • Sort arrays and objects.
  • Transform JSON using JMESPath queries.
  • Colorized code.
  • Color picker.
  • Search & highlight text in the tree view.
  • Undo and redo all actions.
  • JSON schema validation (powered by ajv).

Code mode

  • Colorized code (powered by Ace).
  • Inspect JSON (powered by Ace).
  • Format and compact JSON.
  • Repair JSON.
  • JSON schema validation (powered by ajv).

Text mode

  • Format and compact JSON.
  • Repair JSON.
  • JSON schema validation (powered by ajv).

Preview mode

  • Handle large JSON documents up to 500 MiB.
  • Transform JSON using JMESPath queries.
  • Format and compact JSON.
  • Repair JSON.
  • JSON schema validation (powered by ajv).

Documentation

Install

with npm (recommended):

npm install jsoneditor

Note that to use JSONEditor in Internet Explorer 11, it is necessary to load a polyfill for Promise in your application.

Alternatively, you can use another JavaScript package manager like https://yarnpkg.com/, or a CDN such as https://cdnjs.com/ or https://www.jsdelivr.com/.

Use

Note that in the following example, you'll have to change the urls jsoneditor/dist/jsoneditor.min.js and jsoneditor/dist/jsoneditor.min.css to match the place where you've downloaded the library, or fill in the URL of the CDN you're using.

<!DOCTYPE HTML>
<html lang="en">
<head>
    <!-- when using the mode "code", it's important to specify charset utf-8 -->
    <meta charset="utf-8">

    <link href="jsoneditor/dist/jsoneditor.min.css" rel="stylesheet" type="text/css">
    <script src="jsoneditor/dist/jsoneditor.min.js"></script>
</head>
<body>
    <div id="jsoneditor" style="width: 400px; height: 400px;"></div>

    <script>
        // create the editor
        const container = document.getElementById("jsoneditor")
        const options = {}
        const editor = new JSONEditor(container, options)

        // set json
        const initialJson = {
            "Array": [1, 2, 3],
            "Boolean": true,
            "Null": null,
            "Number": 123,
            "Object": {"a": "b", "c": "d"},
            "String": "Hello World"
        }
        editor.set(initialJson)

        // get json
        const updatedJson = editor.get()
    </script>
</body>
</html>

Build

The code of the JSON Editor is located in the folder ./src. To build jsoneditor:

  • Install dependencies:

    npm install
  • Build JSON Editor:

    npm run build

    This will generate the files ./jsoneditor.js, ./jsoneditor.css, and
    minified versions in the dist of the project.

  • To automatically build when a source file has changed:

    npm start

    This will update ./jsoneditor.js and ./jsoneditor.css in the dist folder on every change, but it will NOT update the minified versions as that's an expensive operation.

Test

Run unit tests:

npm test

Run code linting (JavaScript Standard Style):

npm run lint

Custom builds

The source code of JSONEditor consists of CommonJS modules. JSONEditor can be bundled in a customized way using a module bundler like browserify or webpack. First, install all dependencies of jsoneditor:

npm install

To create a custom bundle of the source code using browserify:

browserify ./index.js -o ./jsoneditor.custom.js -s JSONEditor

The Ace editor, used in mode code, accounts for about one third of the total size of the library. To exclude the Ace editor from the bundle:

browserify ./index.js -o ./jsoneditor.custom.js -s JSONEditor -x brace -x brace/mode/json -x brace/ext/searchbox

To minify the generated bundle, use uglifyjs:

uglifyjs ./jsoneditor.custom.js -o ./jsoneditor.custom.min.js -m -c
smartub-servicepolestar-uiyyd_modulescards-libsbobo-npm-pluginmultifunction-crudsparrow-clientsyl-form-makersuckosuper-form-editorvue2-jsoneditorvue-echarts-editorvue-makersvue-jsonvue-json-editor-ebidsunvue-jsoneditorweaxyyd-componentsyyd-modulesvue-custom-form-makingvue-page-designvue-form-making-yhaozeppelin-json-spellzendo-pczendo-uitn-sharedtriwebformv-json-editv-jsoneditordynamic-characteristicdynamic-json-formen-liberdi-bull-arenaconfiguration-backofficecms7-buefycode-gov-front-endember-jsoneditorcrud-form-libplaygrounds-spux@f-loat/ncform-compslego-form-builderhs-sky-uihs-ui-libraryhsdy-uilevel-json-editform-making-for-meform-master@girder/corefano-antd@dr-kobros/react-jsoneditor@dukefun/mui-componentsh5designerlibc-vueg4elogiclianda-form-making-releaselibj-vue-corelibj-bulmalibweb@glue42/themegirdersexpresscf-designshrimp-vue-componentsshanghongyuan-form-makingshanghongyuan-form-making-releasesite-script-editorsipsd-residential-pipesipsd-vue-form-makingsipsd-vue-mapshowroomsharedb-jsoneditorcharming-vue-adminsimple-react-data-gridsonet-vue-json-editoribird-clientintermix-dashboardintermix-dashboard-mui@gtiot/iot-client@yangsansuan/json-editor@yeanzhi/xharproject-nexusreact-jsoneditor-wrapperrn-config-tylerrocket-portal@r2f/componentsscreen-designer@rainbow-modules/forms@code.gov/json-schema-validator-web-component@code.gov/code-gov-front-end@chief-editor/brick-controlreinform-coregm-design@igorepo/vue@jinzhitiankai/form-making@jinzhitiankai/form-making2@jinzhitiankai/form-making_test@jinzhitiankai/oa-form-making@jinzhitiankai/vcolorpickermftcc-form@jeremyckahn/lateralus-components
9.4.1

13 days ago

9.4.0

21 days ago

9.3.1

28 days ago

9.3.0

1 month ago

9.2.0

2 months ago

9.1.10

3 months ago

9.1.9

3 months ago

9.1.8

4 months ago

9.1.7

4 months ago

9.1.6

5 months ago

9.1.5

5 months ago

9.1.4

6 months ago

9.1.3

6 months ago

9.1.2

6 months ago

9.1.1

8 months ago

9.1.0

8 months ago

9.0.5

8 months ago

9.0.4

9 months ago

9.0.3

10 months ago

9.0.2

10 months ago

9.0.1

11 months ago

9.0.0

12 months ago

8.6.8

12 months ago

8.6.7

12 months ago

8.6.6

1 year ago

8.6.5

1 year ago

8.6.4

1 year ago

8.6.3

1 year ago

8.6.2

1 year ago

8.6.1

1 year ago

8.6.0

1 year ago

8.5.3

1 year ago

8.5.2

1 year ago

8.5.1

1 year ago

8.5.0

1 year ago

8.4.1

1 year ago

8.4.0

1 year ago

8.2.1

1 year ago

8.3.0

1 year ago

8.2.0

1 year ago

8.1.2

1 year ago

8.1.1

1 year ago

8.1.0

1 year ago

8.0.0

1 year ago

7.5.0

1 year ago

7.3.1

1 year ago

7.4.0

1 year ago

7.3.0

1 year ago

7.2.1

2 years ago

7.2.0

2 years ago

7.1.0

2 years ago

7.0.5

2 years ago

7.0.4

2 years ago

7.0.3

2 years ago

7.0.2

2 years ago

7.0.1

2 years ago

7.0.0

2 years ago

6.4.1

2 years ago

6.4.0

2 years ago

6.3.0

2 years ago

6.2.1

2 years ago

6.2.0

2 years ago

6.1.0

2 years ago

6.0.0

2 years ago

5.34.0

2 years ago

5.33.0

2 years ago

5.32.5

2 years ago

5.32.4

2 years ago

5.32.3

2 years ago

5.32.2

2 years ago

5.32.1

2 years ago

5.32.0

2 years ago

5.31.1

2 years ago

5.31.0

2 years ago

5.30.0

2 years ago

5.29.1

2 years ago

5.29.0

2 years ago

5.28.2

2 years ago

5.28.1

2 years ago

5.28.0

2 years ago

5.27.1

2 years ago

5.27.0

2 years ago

5.26.3

2 years ago

5.26.2

2 years ago

5.26.1

2 years ago

5.26.0

2 years ago

5.25.0

3 years ago

5.24.7

3 years ago

5.24.6

3 years ago

5.24.5

3 years ago

5.24.4

3 years ago

5.24.3

3 years ago

5.24.2

3 years ago

5.24.1

3 years ago

5.24.0

3 years ago

5.23.1

3 years ago

5.23.0

3 years ago

5.22.0

3 years ago

5.21.0

3 years ago

5.20.0

3 years ago

5.19.2

3 years ago

5.19.1

3 years ago

5.19.0

3 years ago

5.18.0

3 years ago

5.17.1

3 years ago

5.17.0

3 years ago

5.16.0

3 years ago

5.15.0

3 years ago

5.14.1

3 years ago

5.14.0

3 years ago

5.13.3

3 years ago

5.13.2

3 years ago

5.13.1

3 years ago

5.13.0

3 years ago

5.12.0

3 years ago

5.11.0

3 years ago

5.10.1

3 years ago

5.10.0

3 years ago

5.9.6

4 years ago

5.9.5

4 years ago

5.9.4

4 years ago

5.9.3

4 years ago

5.9.2

4 years ago

5.9.1

4 years ago

5.9.0

4 years ago

5.8.2

4 years ago

5.8.1

4 years ago

5.8.0

4 years ago

5.7.2

4 years ago

5.7.1

4 years ago

5.7.0

4 years ago

5.6.0

4 years ago

5.5.11

4 years ago

5.5.10

5 years ago

5.5.9

5 years ago

5.5.8

5 years ago

5.5.7

5 years ago

5.5.6

5 years ago

5.5.5

5 years ago

5.5.4

5 years ago

5.5.3

5 years ago

5.5.2

5 years ago

5.5.1

5 years ago

5.5.0

5 years ago

5.4.0

5 years ago

5.3.0

5 years ago

5.2.0

5 years ago

5.1.5

5 years ago

5.1.4

5 years ago

5.1.3

5 years ago

5.1.2

5 years ago

5.1.1

5 years ago

5.1.0

5 years ago

5.0.1

5 years ago

5.0.0

5 years ago

4.2.1

6 years ago

4.2.0

6 years ago

4.1.3

6 years ago

4.1.2

6 years ago

4.1.1

6 years ago

4.1.0

6 years ago

4.0.0

6 years ago

3.2.0

6 years ago

3.1.2

7 years ago

3.1.1

7 years ago

3.1.0

7 years ago

3.0.0

7 years ago

2.3.6

7 years ago

2.3.5

7 years ago

2.3.3

8 years ago

2.3.1

8 years ago

2.3.0

8 years ago

2.2.2

8 years ago

2.2.1

8 years ago

2.2.0

8 years ago