Dcc.dropdown multi select not working after deploying to free Heroku

Hello, sorry this is probably due to an error on my part as this is my first deployment.

When testing locally, the multi select feature of my dropdowns were working fine. After deploying them to Heroku, they now only allow one selection.

It appears that callbacks are all working fine.

Here is the source code: https://github.com/chrs-ptr-hntr/AttainmentSuite/

And live link: https://attainmentsuite.herokuapp.com/

Update: Issue is also found locally. I believe it is a by product of callbacks updating other available dropdown options

Thank you

This is weird indeed. Are you using the same version of dash-core-components on your machine as in the heroku deployment?

I’m not at home right now, but my requirements.txt file was directly populated from the same conda environment I’ve been using to test. Look like 1.1.2 is the latest as well.

I’ll double check when I am home tonight, but not expecting it to be different as I am a very new user, so not long installed.

Someone at home was able to run pip list and definitely 1.1.2.

I just cloned your repository and ran it locally and saw the same issue as the deployed version with the multi dropdowns only allowing a single selection. Which suggests it might not be a Heroku issue. Can you check that your local version is definitely working for you with the code as it is on GitHub?

Also check that you have the exact same versions as the requirements file. If you’re on mac or linux you could do something like

pip freeze > installed.txt
diff installed.txt requirements.txt

That’s really helpful to know. I’ll check when I’m home and update.

Well. It actually is not working for me locally now. I haven’t been working on that section much, can anyone spot any obvious issues.

Most recent thing is probably wrapping it in the bootstrap column.

So, it’s actually a problem with my callbacks which filter the other dropdown options. Before I implemented that it was working. So all the Output(ID, ‘options’).

Could anyone offer advice/examples to study on how to approach that? Seems to work but only allows one selection.

Edit: I actually wasn’t sure I should load multiple inputs and outputs together but when seeing the behaviour I was expecting I just went with it!

I had another look at the code, i think the problem is that your callbacks are filtering out all the options except for the one that is already selected. For example, if I make a selection for school the else block gets run

if not selected_school:
    dfa = dfa
    afa = afa
    dfa = dfa[dfa['School'].isin(selected_school)]
    afa = afa[afa['School'].isin(selected_school)]

so now dfa contains only rows where School is the selected school. However the callback updates Output("school_filter", "options") to be [{'label': i, 'value': i} for i in sorted(dfa["School"].unique())]. Since dfa has only rows with the selected school, the only option is the school that’s already selected, so when you click on the dropdown it refuses to expand.

I suspect the other issues are all of the same nature, so you just need to double check your callback logic.

Oh god. Of course, thank you for that. I was careless when lumping together my graph update callback.

1 Like