Python Flask WTForms 依赖下拉列表答案

【问题标题】：Python Flask WTForms Dependent DropdownPython Flask WTForms 依赖下拉列表
【发布时间】：2018-10-23 20:15:04
【问题描述】：

我想知道是否有人可以帮助我。

我希望能够点击客户，并且位置基于某个客户，这是一个依赖下拉菜单。此信息来自数据库，因此以下代码中的查询。

这是我的客户和位置表单函数

class CustomerPick(SubForm):
    customer = QuerySelectField(u'Customer',
                            get_label=u'sCustomer',
                            query_factory=lambda : 
                            (TCustomer.query.order_by(TCustomer.sCustomer)),
                            validators=[DataRequired(),])
    location = QuerySelectField(u'Location',
                            get_label=u'sLocation',
                            query_factory=lambda : 
                            (TLocation.query.order_by(TLocation.sLocation)),
                            validators=[DataRequired(),])

这是视图部分

@route('new/', methods=['GET', 'POST'])
def new(self):
    form = CustomerPick()
    if form.validate_on_submit():

这是下拉菜单的图片，也供参考，如果你们还有什么需要尝试的，请告诉我。提前致谢！ Photo

【问题讨论】：

您的意思是如果用户选择“Adam”作为Customer，Location 下拉菜单应该相应地过滤，反之亦然？
是的，如果用户点击“Adam”，那么与 Adam 相关的所有位置都会列在位置列表中
由于您需要用户操作来触发后端操作，因此您需要使用 javascript 将操作发送到端点。这可能比您预期的要复杂。
我希望它去js，我只是不确定如何实现它。

标签： python postgresql flask flask-sqlalchemy

【解决方案1】：

我不太明白您的问题，但您希望能够点击用户并根据位置填充下拉列表？

这涉及一些 Ajax 来回发送数据。我给你一个最小化版本的代码 sn-p（未测试）。

 // front-end - this handles user behavior in dropdown. When a user changes a value
 // in a user drop down, it will send a request to your Flask view function.
 $("#user_drop_down").change(function () {
        let user_identifier = this.value;
        $.ajax({
            type: "GET",
            url:/url_to_flask_view_function/,
            data: {user_identifier: user_identifier},
            success: function (resp) {
                $('#your_designated_div_for_both_dropdowns_div').html(resp.data)
            }
        });
    });

# back-end - this receives the request sent from front-end and process the Flask-WTF
# form options so that it can render different options in the dropdowns. In this view
# function, we will return jsonified template with newly processed form_object
# instead of rendering the option data. You can return the json with only the data
# but it involves more javascript parsing and may be difficult for you.
@app.route('/url_to_flask_view_function/')
def form_processing():
    user_identifier = request.args.get('user_identifier)
    # now we've gotten the user_identifier, you will need to query. Below query is totally made up.
    query_to_where_location = Location.query.filter(Location.user_identifier= user_identifier).first()
   # your query result will not be in a tuple format
   # if your query result is like this "locA, locB, locC, locD", you need to process
   # it so that you make [('locA', 'locA'), ('locB', 'locB').......] 
   form_object = MyForm()

    form_object.location.choices = processed_list
    return jsonify({"data":render_template('template_that_contains_your_drodpdowns.html',
                                   form_obj=form_obj)})

<!-- HTML piece, you should've had this already but make sure to specify your fields in HTML following Jinja2 synthax.-->
<form>
{{form_object.user}}
{{form_object.dropdown}}
</form>

总之，这里的想法是您使用.change 捕获用户行为，然后根据更改，您将使用 user_identifier 发送请求到服务器端。一旦它到达服务器端，您将对数据库进行查询，并使用不同处理的表单再次呈现相同的模板。

执行此操作的最佳方法是，一旦您将 user_identifier 放入您的视图，您进行查询并返回 jsonified 位置对象，然后在您的成功块中，您将更改该下拉输入元素的。

如果您还有其他问题，请告诉我。

【讨论】：