背景:这是一个可能还不存在的东西的请求,但我一直想要建立一个很长一段时间。首先,我想问问有没有人看过这样的电影。

假设你有一个任意的JSON结构,如下所示:

{
    'title_str':'My Employee List'
    ,'lastmod_str': '2009-June-15'
    ,'employee_table':[
        {'firstname':'john','lastname':'doe','age':'33',}
        ,{'firstname':'jane','lastname':'doe','age':'34',}
        ,{'firstname':'samuel','lastname':'doe','age':'35',}
    ]
}

问:有没有一种基于web的JSON编辑器可以采用这样的结构,并自动允许用户在用户友好的GUI中修改它?

示例:想象一个自动生成的HTML表单,它显示title和lastmod的2个输入类型文本控件,以及arr_list的3列3行输入类型文本控件表……通过点击表中每一行旁边的[+][X]来删除或添加额外的行。

重要思想:这背后的“重要思想”是用户可以指定任何任意的(非递归的)JSON结构,然后还可以使用基于gui的交互来编辑结构(这类似于XML Spy中的“XML编辑器网格视图”)。

参见:

是否有一个基于JSON api的本地托管CMS ? https://ux.stackexchange.com/questions/37237/treetable-as-a-flexible-condition-filter-editor JSON-editor YAML GUI

更新:(Thu 2014-07-31 18:31:11)

已经创建了一个github存储库来进一步跟踪这个封闭的SO帖子。

https://github.com/dreftymac/stackoverflow.questions.998832


更新:为了回答我自己的问题,以下是我目前所能发现的。如果其他人有什么消息,我仍然有兴趣了解更多。

http://knockoutjs.com/documentation/plugins-mapping.html ;; knockoutjs.com nice http://jsonviewer.arianv.com/ ;; Cute minimal one that works offline http://www.alkemis.com/jsonEditor.htm ; this one looks pretty nice http://json.bubblemix.net/ Visualise JSON structute, edit inline and export back to prettified JSON. http://jsoneditoronline.org/ Example added by StackOverflow thread participant. Source: https://github.com/josdejong/jsoneditor http://jsonmate.com/ http://jsonviewer.stack.hu/ mb21.github.io/JSONedit, built as an Angular directive

基于JSON模式

https://github.com/json-editor/json-editor https://github.com/mozilla-services/react-jsonschema-form https://github.com/json-schema-form/angular-schema-form https://github.com/joshfire/jsonform https://github.com/gitana/alpaca https://github.com/marianoguerra/json-edit https://github.com/exavolt/onde 生成JSON模式的工具:http://www.jsonschema.net http://metawidget.org 可视化JSON编辑器,Windows桌面应用程序(免费,开源),http://visualjsoneditor.org/

商业(没有有意或暗示的背书,可能符合也可能不符合要求)

液态XML - JSON模式编辑器图形化JSON模式编辑器和验证器。 http://www.altova.com/download-json-editor.html XML ValidatorBuddy - JSON和XML编辑器支持JSON语法检查,语法着色,自动补全,JSON指针计算和JSON模式验证。

jQuery

formbuilder jQuery拖放 formeo shalotelli form_builder

YAML

Konstellate Reddit Post

另请参阅

谷歌块 是否有一个基于JSON api的本地托管CMS ? 基于cms的概念;;http://www.webhook.com/ 基于树的小部件;;http://mbraak.github.io/jqTree/ http://mjsarfatti.com/sandbox/nestedSortable/ http://jsonviewer.codeplex.com/ http://xmlwebpad.codeplex.com/ http://tadviewer.com/ https://studio3t.com/knowledge-base/articles/visual-query-builder/


通常,当我想创建JSON或YAML字符串时,我首先构建Perl数据结构,然后对其运行简单的转换。你可以把一个UI放在Perl数据结构生成的前面,例如一个web表单。

将结构转换为JSON非常简单:

use strict;
use warnings;
use JSON::Any;

my $data = { arbitrary structure in here };
my $json_handler = JSON::Any->new(utf8=>1);
my $json_string = $json_handler->objToJson($data);