当前位置: 首页 > 面试题库 >

基于GUI或基于Web的JSON编辑器,其工作方式类似于属性浏览器

尚宏硕
2023-03-14
问题内容

背景: 这是对可能尚不存在的要求,但是我一直想建立一个很长的时间。首先,我要问是否有人看到过类似的东西。

假设您具有如下所示的任意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的输入类型文本控件,以及一个用于arr_list的具有三列和三行的输入类型文本控件表…可以删除或单击表中每行旁边的[+]
[X]添加其他行。

大想法: 这背后的“大想法”是,用户将能够指定任何任意(非递归)JSON结构,然后还能够通过基于GUI的交互来编辑该结构(这与XML Spy中的“
XML编辑器网格视图”。

也可以看看:

  • https://ux.stackexchange.com/questions/37237/treetable-as-a-flexible-condition-filter-editor

更新:(星期四2014-07-31 18:31:11)

已经创建了一个github存储库以进一步跟踪此已关闭的SO帖子。

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

问题答案:

更新: 为了回答我自己的问题,这是到目前为止我已经发现的内容。如果外面还有其他人,我仍然有兴趣了解更多信息。

  • http://knockoutjs.com/documentation/plugins-mapping.html ;; kickoutjs.com不错
  • http://jsonviewer.arianv.com/ ;; 可爱的最小版本,可以离线工作
  • http://www.alkemis.com/jsonEditor.htm ; 这个看起来不错
  • http://www.thomasfrank.se/json_editor.html
  • http://www.decafbad.com/2005/07/map-test/tree2.html大纲编辑器,不是真正的JSON
  • http://json.bubblemix.net/可视化JSON结构,内联编辑并导出回经过修饰的JSON。
  • http://jsoneditoronline.org/由StackOverflow线程参与者添加的示例。资料来源:https : //github.com/josdejong/jsoneditor
  • http://jsonmate.com/
  • http://jsonviewer.stack.hu/
  • mb21.github.io/JSONedit,作为Angular指令构建

基于JSON模式

  • https://github.com/jdorn/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
  • Visual JSON编辑器,Windows桌面应用程序(免费,开放源代码),http://visualjsoneditor.org/

商业(无意或暗示背书,可能会或可能不会满足要求)

  • Liquid XML-JSON模式编辑器图形化JSON模式编辑器和验证器。
  • http://www.altova.com/download-json-editor.html
  • XML ValidatorBuddy -JSON和XML编辑器支持JSON语法检查,语法着色,自动完成,JSON指针评估和JSON模式验证。

jQuery的

  • formbuilder jQuery拖放
  • 形式
  • shalotelli form_builder

YAML

  • Konstellate Reddit邮政

也可以看看

  • 谷歌块状
  • 基于树的小部件 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/


 类似资料:
  • 问题内容: 我想提供一个WYSIWYG工具,最好是基于JavaScript的工作流图表(即有向图)。我需要商业软件友好许可,其中包括向OEM付费。如果有必要的服务器端组件,则需要Java或ColdFusion,因为我正在与现有产品集成。 我的工作流图可以有多个起始顶点,但是只有一个终止顶点和边是有向的。除了所见即所得的编辑之外,我还在寻找一种可以帮助以下方面的工具: 能够导出工程图,因此可以是:

  • 我一直在努力使我的JSON模式正确。我有一个属性,我必须根据它来确定所需的属性。下面是我的示例,我希望通过验证,因为不存在。 这是我希望通过验证的JSON 类似地,如果是,那么上述两个JSON的验证都应该通过。

  • 我正在使用JavaFX属性的模型实体consitiing witch允许我更改单个位置上的值,将它们绑定到UI,并在模型实体数组中添加带有额外条件的更改的监听器(惟一值等)。 我必须将模型存储在数据库中,所以问题如下: 注意:一些可绑定属性根本不必持久化。

  • 目前,我正在创建基于Eclipse4的RCP应用程序,它有部分(视图和编辑器)。我想添加一个基于GEF的图形编辑器。但是没有找到任何关于Eclipse4和GEF的教程。 目前,我也看到了GEF4,但它的渲染引擎是JavaFX。我不应该使用GEF4,因为我必须提供图形编辑器和不同部分之间的拖放功能。

  • 我正在研究SAML和SSO,看起来使用SAML的应用程序需要是一个web应用程序,并且依赖于浏览器。 有人能告诉我为什么吗? 我对SAML的有限知识告诉我,SAML依赖于会话和cookie,这在桌面应用程序或移动应用程序中是不可用的。这是唯一的原因吗?你能告诉我更多的细节吗?

  • 问题内容: 我们可以从javascript获取浏览器名称,但是有没有办法相应地更改css。我的意思是一些css文件类,因为我不想链接另一个css文件,我想在上面写样式 问题答案: 有两种方法: 客户端:您需要使用Javascript来检测浏览器并导入适当的CSS样式。看一下这篇文章。(链接不再可用) 服务器端:您需要检测]用户代理并提供适当的HTML。这是为此的PHP源链接。