https://github.com/mirshahreza/jsontoform

A jquery plugin to turn json schema to form
https://github.com/mirshahreza/jsontoform

editor jquery json json-editor json-schema property-editor

Last synced: about 1 month ago
JSON representation

A jquery plugin to turn json schema to form

• Host: GitHub
• URL: https://github.com/mirshahreza/jsontoform
• Owner: mirshahreza
• License: mit
• Created: 2019-01-30T03:54:58.000Z (almost 6 years ago)
• Default Branch: master
• Last Pushed: 2024-05-21T04:54:55.000Z (7 months ago)
• Last Synced: 2024-05-21T05:49:48.071Z (7 months ago)
• Topics: editor, jquery, json, json-editor, json-schema, property-editor
• Language: JavaScript
• Size: 211 KB
• Stars: 18
• Watchers: 2
• Forks: 6
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
**Why jsonToForm**

 - Fast and easy to use.

 - RTL support : just add style (direction:rtl) to the place holder element.

 - It just depends on jQuery.

 - It can be use in tow mode : property grid(currently implemented) / normal form(road map).

 - Easy to customize css.

 - Supported inputs : text/checkbox/textarea/html/color/date/number/radio/select.

 - Validation support.

 - Additional text option for describing inputs.

 - Based on schema standard.

**How to use**

- A demo.html is included that describe the usage.

**Options**

- schema / default : {} / a json schema  

- value / default : {} / a json object  

- expandingLevel / default : -1 / tree levels that initially is expanded. by default all levels will be expanded 

- renderFirstLevel / default : false / indicates root element renders as a visual container or no

- autoTrimValues / default : true / trims spaces automatically

- indenting / default : 5 / number of spaces for each level of tree

- treeExpandCollapseButton / default : true / show buttons to expand/collapse tree nodes 

- selectNullCaption / default : '' / caption for select elements when is null

- selectNullCaption / default : 'null' / caption for radio elements when is null 

**Events**

- afterValueChanged  

- afterWidgetCreated

**Methods**

- isValid()  

- getSchema()

- getValue()

- setValue(value)

**Next step V1.1.1**

- Defaults for schema / reset to default button

- Validation by regular based on schema standards

- Validation for array items based on schema standards

**Road map**

- Checkbox list (when node is simple array)

- Including some important schemas like schema(for design another schema) / css 

- Including some important regulars like email/website/...

- Layout option for switching between property grid mode and normal form

- Auto complete source for inputs by connecting to other API

- Additional item for object nodes

**Similar projects**

 - https://github.com/jsonform/jsonform 

 - https://jsonforms.io/

 - https://github.com/jdorn/json-editor

 - https://github.com/plantain-00/schema-based-json-editor

 - https://github.com/codecombat/treema

 - https://json-schema-editor.tangramjs.com/

 - https://github.com/yourtion/vue-json-ui-editor