如何为网页 <select> 框创建复杂的数据绑定？

Posted 2023-02-19

【中文标题】如何为网页 <select> 框创建复杂的数据绑定？

【英文标题】：How to create complex data-bindings for webpage <select> boxes?

【发布时间】：2011-06-12 00:16:05

【问题描述】：

我正在 Google App Engine 上构建一个数据库查询向导。对于浏览器前端，我需要在网页上的框/菜单之间进行一些动态数据绑定。

具体来说，当 SelectBoxA 更改时，应该更新一堆其他 Selectbox（基本上是所选表中的属性菜单。存储在数组中的模式）。问题是可以有任意数量的，这取决于用户在查询中添加了多少元素。最后，SelectBoxZ 应该跟踪添加了哪些元素，因此它也必须动态更新/填充。

任何涉及 javascript 的解决方案都可以，或者使用与服务器的交互（使用 Ajax 或 Python 或其他）。

我已经尝试过 Knockout JS，但我似乎一次只能让一个视图模型工作，而且我认为它不会很容易地处理添加到页面的新元素。还查看了 Backbone JS，但从给出的文档中，我无法弄清楚如何去做。

非常感谢网络上类似项目的任何建议、解决方案或示例。

【问题讨论】：

我一直在尝试使用 KnockoutJS，它可以轻松处理多个模型。它还将非常轻松地处理添加到页面的新元素。使用 KO 时必须小心的一件事是，如果您使用多个模型，请提供一个 DOM 元素来绑定。

事实证明我并不真的需要多个视图模型，我可以根据需要向现有视图模型添加尽可能多的字段。

【参考方案1】：

你看过ProtoRPC吗？

在announcement blob post 中，他们展示了如何将它与 jQuery 一起使用。