jquery - JavaScript : Algorithm or method to bind an array of objects to a DOM display?

Question

优点:

我们使用 JQuery 和 .ajax() 发送嵌套对象的 JSON 数组。我们使用 JQuery 和 Microsoft 模板来呈现内容。它在 400 毫秒内发送 100 个对象。这比我们在 10 秒内渲染 50 个产品的等效服务器要快得多。

难度:

我们需要将 JavaScript 对象数组绑定(bind)到它表示的 DOM html 元素，即对 html 输入的更改将反射(reflect)回 JavaScript 对象。我们的困难在于我们的对象是嵌套的，并且仅包含选定的选项:

Product[].Department[].deptid;
// We only store the departments for which this product participates

我们尝试使用 JQuery 进行 Microsoft 数据链接，这需要对象属性和 html 元素都存在才能将它们绑定(bind)在一起。对于上述情况来说，这并不好。我们可以这样做:

Product[].Department[].Dept.id;
Product[].Department[].Dept.name;
Product[].Department[].Dept.selected;  // true if selected, false if not
// This requires all possible options in all needed products.  Yuck

是否有关于如何最好地处理将 JavaScript 嵌套对象数组绑定(bind)到它们所代表的 HTML 元素的示例？

我们不会将表单元素提交回服务器。相反，我们将它们收集到 JSON 数组中并将其发送回服务器。它的工作速度非常快，但组装却很乏味。

Answer 1

从您的描述中很难确切知道您遇到了什么问题，但似乎有两件事可能会有所帮助:

1) 您可以使用 jQuery 的 data() 方法在 dom 元素上存储数据 http://api.jquery.com/data/

2) 您可以使用change() 事件和val() 方法获取表单元素的值。 (您还可以在 API 文档中找到这些内容。)

但似乎您可能会遇到一些更基本的问题，例如如何知道哪个 Javascript 对象与表单元素搭配的问题。是这样吗？