javascript - 级联下拉列表

Question

我正在开发一个 Web 应用程序，并尝试用两个下拉列表编写一个表单。第二个下拉列表中的列表将取决于第一个下拉列表中的选择。任务本身并不太复杂，除了一旦做出第一个选择，我需要进行数据库调用以提取第二个下拉列表的数据。这是我遇到困难的地方。这两个列表实际上都是从数据库中填充的。

我正在使用 python 脚本处理此问题，并且一直在尝试使用 onChange javascript 函数来执行此操作。Web 应用程序是在 Zope 中构建的，页面模板可能是带有 python 脚本的选项。

Answer 1

您将不得不在这里使用 Ajax 和 javascript 的组合。您的选择下拉菜单的 Onchange 事件调用 javascript 函数。这个 javascript 函数将向 python 脚本发出 ajax 请求，该脚本实际上会命中数据库并在 javascript 变量中返回响应。使用这个 javascript 变量，您可以编辑 DOM 并设置第二个选择框的 html。

看看你能不能从中得到一些提示：http: //www.satya-weblog.com/2007/04/dynamically-populate-select-list-by.html

Answer 2

这正是我所做的。下面是我想出的javascript函数。OnChange，我调用 getOptions，pythonScript 创建第二个下拉列表。我可以传入一个参数来获取此下拉列表所需的数据。谢谢！

  function getOptions() {
    var code = 'code=' + $("dropdown1").getValue();
    var myAjax = new Ajax.Updater('dropdown2', './pythonScript', { method: 'get', parameters: code });
  }