下拉菜单选项父子

Question

[环境]

Flask Web 应用程序，Python3.7，MySql

[我想做什么]

我有一个由按钮触发的模态表单。在模式内部有几个输入字段。其中，2个下拉菜单。下拉菜单 A 包含类别，而下拉菜单 B 包含子类别。

当从下拉菜单A中选择一个类别时，我想相应地更改下拉菜单B的选项。（比如A为1，我想让B只显示1a,1b,1c，否则A为2，B应该只显示2a,2b,2c）

此外，数据以列表的形式从数据库中获取。数据库结构应该是这样的：

#类别#

ID	Category
1	1
2	2
3	3

#子类别#

ID	Category	Subcategory
1	1	1a
2	1	1b
3	1	1c

下拉菜单 A 正确显示选项。（下面的代码）我对下拉菜单 B 有问题。（显示所有子类别，而不考虑所选类别）

HTML

<select class="form-control" name="bal-edit-category" required>
        <option disabled selected value> {{ row.category }} </option>
        {% for category in category %}
        <option value="{{ category.category }}">{{ category.category }} 
        </option>
        {% endfor %}
</select>

Python 烧瓶

cursor = mysql.connection.cursor(MySQLdb.cursors.DictCursor)    
cursor.execute('SELECT category FROM category')
category = cursor.fetchall()
return render_template('test.html', category=category)

如有任何意见或建议，我们将不胜感激。

Answer 1

多谢影子指点。千辛万苦终于得到了想要的结果。基本上，我只是写了一段 Python 代码并通过 Ajax 调用它。然后 Javascript 脚本将处理下拉菜单的更改并仅显示相关内容。

下拉菜单选项父子

pulldown menu option parent-child

javascript

python

mysql

jinja2

flask