使用底层客户端JSON数据连接、构建和操作JQuery UI

Connecting, building and manipulating a JQuery UI with underlying client-side JSON data

本文关键字：构建 操作 UI JQuery 连接 数据 客户端 JSON      更新时间：2023-09-26

我正在使用一个静态JSON文件，用于填充基于jquery的可排序列表。

例如:

[
     { "id": 0, "movie_name": "Manhattan", "location":"NY" },
     { "id": 1, "movie_name": "A Wonderful Life" }
]

网页遍历JSON数组，并构建movie_name字段的可排序列表以及每个字段的附加文本框，例如，允许用户输入评论。用户还可以对列表重新排序，最终将在服务器端持久化。每个项目可能有一些没有出现在其他项目中的字段，例如，"location"出现在第一项中，但没有出现在第二项中。'id'字段出现在每个项目中，表示电影的唯一标识符，但不显示。

一旦完成，我希望用户能够将列表提交回服务器，并将详细信息添加或重新排序为JSON，如下所示:

[
     { "id": 1, "movie_name": "A Wonderful Life", "review":"user entered data" }
     { "id": 0, "movie_name": "Manhattan", "location":"NY", "review":"user entered data" },
]

我不确定维护和构建发送回服务器的JSON数组的最佳方式。

我的主要问题是，当UI组件被操作和提交时，如何将它们连接回底层JSON对象?

最好是在字段更改时更新底层JSON数据(如果是，如何更新?)，还是在用户提交数据后重新构建JSON数据(后一种方法不一定对所有未显示的字段具有可见性)。

希望这是有意义的。:)

谢谢你的帮助。

JSON是一种数据格式，而不是数据。在您的示例中，您应该在页面加载中通过id将这些json解析为一些类似哈希的对象。然后在每个uiupdate。更新那个对象。最近提交——将该对象转换回类似数组的结构，然后仅将其转换为JSON。

相关文章：