7

我想为我的用户提供一个编辑 JSON 对象的界面。

例如，我有一个使用以下选项调用 Google 图表的 JavaScript：

var options={
    chartType: "Pie",
    title:"Chart title",
    is3D:false,
    width:500,
    height:300,
};

理想情况下，我的用户应该能够自己修改选项，而无需查看代码。他们将看到一个从对象自动构建的 UI，其中：

  • chartType 是一个选择 (Pie, Line, Bar)
  • 标题是文本输入
  • is3D 是一个复选框
  • 等等

有这方面的图书馆吗？如果没有，有什么建议可以开始吗？

我当然可以手动构建表单，但我的想法是有一个适用于任何对象的通用解决方案。

4

4 回答 4

4

我发现这个链接带有描述 JSON 的约定：http: //www.json-schema.org/

搜索“JSON 模式”让我找到了许多解决方案，尤其是这篇文章：

基于 GUI 或基于 Web 的 JSON 编辑器，类似于属性浏览器

它始于两年前，但显然有据可查并保持最新。

另外，2012 年 4 月在 ibm 网站上的帖子：

http://www.ibm.com/developerworks/library/wa-jsonschema/index.html?cmp=dw&cpb=dwwdv&ct=dwnew&cr=dwnen&ccy=zz&csr=040512

于 2012-04-19T15:02:13.990 回答
1

问题

如何提供一种用户友好的方式来构建任意 JSON 结构，其中：

  • 用户界面直观、灵活，无需开发人员技术水平即可使用
  • 用户界面可以从 JSON 的结构中推断出来
  • 对用户界面的修改需要很少或不需要开发人员干预
  • 对底层 JSON 结构的修改可以自动触发对相应用户界面的修改

解决方案

如果这是问题的基本前提，那么这种方法似乎确实可以使用“MVVM”命名法下的各种方法中的任何一种（这显然是“MVC”模因的变体）。

例子

http://knockoutjs.com/examples/cartEditor.html http://en.wikipedia.org/wiki/Model_View_ViewModel#Open_source_MVVM_frameworks

也可以看看

基于 GUI 或基于 Web 的 JSON 编辑器，类似于属性浏览器

于 2012-10-04T21:55:22.890 回答
0

编写一个 web 表单来检测服务的参数。获得参数后，根据可用参数生成表单。提交您的表单并获取 JSON 结果。

于 2012-04-18T20:42:12.933 回答
0

不，您需要自己构建表单。HTML 表单只是描述（请求的）属性要求的一种方式，它们的序列化只会返回所需的对象。在您的示例中，它将是

<select name="chartType"><option value="Pie"/><option value="Line" />...</select>
<input type="text" name="title" />
<input type="checkbox" name="is3D" />
<input type="number" name="width" />

等等。表单还允许您描述模式、最小值/最大值、默认值以及此类库可以处理的所有内容。你可能会发现一个库，它变成了一个简单的

{
    chartType: ["Pie", "Line", "Bar"],
    title:"string",
    is3D:"boolean",
    width:"number"
}

进入上面的 html 并提供一个跨浏览器序列化功能，但是当它变得更复杂时（例如预选“行”，有一个默认标题等），你将回到 html（或它的 js 表示）。

于 2012-04-18T20:50:15.747 回答