Python Flask Dependent Dropdown

[Anfaa]

Hello,

I was wondering if one of you could possibly help me with a problem I'm having. The details are listed in the stack overflow link, please advise. Thank you in advance.

https://stackoverflow.com/questions/5295...2_52957198

[j.crater]

Hello,
we would much rather see if you explained the problem here, as well as post the code in Python code tags. Thanks.

[Anfaa]

Hello,
we would much rather see if you explained the problem here, as well as post the code in Python code tags. Thanks.

Sure no problem:

I was wondering if someone could help me.

I want to be able to click on customer and locations be based off of the certain customer, being a dependent dropdown. This information is coming from a database, hence the queries in the following code.

This is my form function for both customer and location

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(),])

Here is the view portion

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

This is a picture of the dropdown also for reference, if there is anything else needed for you guys to have a go please let me know. Thanks in advance! https://i.stack.imgur.com/Nzf5J.png

[nilamo]

This is almost entirely a javascript thing, using ajax to populate the location dropdown. On the server side, you'll need to write a small function that takes a customer id, and returns locations for them. I don't know what database wrapper you're using, so you'll have to obviously change a few things to make it work, but it'll end up looking roughly like: (I'm freehanding this code without trying any of it, so there might be obvious syntax errors fyi)

# with your imports... from flask import jsonify # with your other routes... @route("/location/:customer_id") def lookup_location(self, customer_id): locations = self.db.Locations.find_by_customer(customer_id) return jsonify(locations)

Then, in js, create an event handler to watch for change events, and update the locations accordingly. With jquery, it'd look a little like:

<script type="text/javascript"> $(function() { $("#customer_dropdown").change(function() { var customer_id = $(this).val(); $.ajax( { url: "/location/", type: "post", dataType: "json", data: { customer_id: customer_id } }) .done(function(data) { // clear any locations currently there $("#location_dropdown").html(""); for (var ndx = 0; ndx < data.length; ndx++) { var item = data[ndx]; var option = document.createElement("option"); option.value = item["value"]; option.text = item["description"]; $("#location_dropdown").append(option); } }); }); }); </script>