Call Back with multiple Inputs

Hey guys, I am trying to update a plot (plot3) based on clicks done on two different scatter plots (plot1, plot2). Clicking over a point will update the timeseries (plot3). The problem here is that I want the user to have the choice of doing the selection in either plot1 or plot2. I am not able to find a way to determine which input triggered the callback, I haven’t figured out a way around this.

@app.callback(
dash.dependencies.Output('WA_id', 'value'),
[dash.dependencies.Input('graph2', 'clickData'),dash.dependencies.Input('graph3', 'clickData')],
[dash.dependencies.State('WA_id', 'value')])

def update_box_WA_ID(hoverData,hoverData2, x1):
if type(hoverData)==dict:
h1 = hoverData[‘points’][0][‘text’]
y1 = h1[:h1.find(’ - ')]

if type(hoverData2)==dict:
    h2 = hoverData2['points'][0]['text']
    y2 = h2[:h2.find(' - ')] 

if x1 != y2:
    return y2
if x1 != y1:
    return y1

Thanks for your help!

1 Like

Dash doesn’t at the moment provide a convenient way for determining which component was the triggering input of a callback. The simplest way to do this is to just have two separate callbacks, each which target the same output but only have one of the inputs each. If you want to avoid duplicated code then you can create a helper function that the two callbacks use.

Hey seems that I can only have one callback per output:

CantHaveMultipleOutputs:
You have already assigned a callback to the output
with ID “WA_id” and property “value”. An output can only have
a single callback function. Try combining your inputs and
callback functions together into one function.

:frowning:

1 Like

Ahh yes, my bad, forgot about that. My apologies. There’s a discussion here about providing the ability to determine which Input was the triggering one, and it references a PR for adding access to the previous state of inputs. It’s not not clear when/if this will be merged though.

It’s possible you might need to settle for having two separate graphs for now. But perhaps other people might have some suggestions.

I have the same problem.

I have a toolbar of icons Add, Cut, Copy, Paste and Delete that i want to work with the same datatable.
I can only have one callback with the dataTable as the output , so I need to list all of my icons as inputs. How do I know which one was clicked on?

Thanks,

John.

1 Like

I have a similar problem. I have a form with three sections: A, B, C. Users can fill in any combination of them (and in future, multiple instances of each type). I store the data as a json string in a hidden div as recommended. However, since multiple callbacks point to the same ID and property, Dash throws a CantHaveMultipleOutputs error.

I could read it all at once, but this is very inflexible and quite ugly: it would be better if it were modular.

Any advice on how I can get around this?

Hi, I got introduced to dash a few days ago and stuck with something. I have a drop down with some values and I would like to have different bar plots whenever a user selects a value of interst from the drop down list. Say if someone selects age (Bar plot, x=names, y=age), if they select salary (bar plot with x=names, y=salary) Could you Kindly give me as small example of how to do this if I have a data frame with these values? I figure I may need a number of if statements in here. Your help will be highly appreciated.

Thanks

I solved my problem - I had mixed up my call back function!

Hi, i am using django dash plottly. passing primary key in url and get id and update layout. But when i am trying to input different it gives “You have already assigned a callback to the output
with ID “event_title” and property “children”. An output can only have
a single callback function. Try combining your inputs and
callback functions together into one function.”
please help , how to resolve it.

Is there a pattern for how to approach this?
I’m new to Dash and I really like it, but to have only one callback per Output seems very limiting, surely there’ s a pattern for how to deal with it, is there?
I couldn’t even figure out the basic example with one div displaying a number, and two buttons next to it, one for incrementing the number, the other for decrementing it.
Even if I put all the logic in one big callback, which sounds quite ugly, I don’t evne know what triggered the callback, as I alway get all values, as if it was an application state rather than events happening inside the application.
Other thatn that, the separation of logic and view is really nive in Dash, and the ability to receive other components state in the callback makes for really easy to understand code. Only this bit, I just don’t understand where it comes from.
Can someone explain, by any chance, what the idea behind it is?

1000x thanks in advance!
Tino

No one talked about dash.callback_context yet.
I highly recommend it for it is the cleanest (and recommended) way of dealing with such a scenario (multiple triggers from different inputs changing the same output). Here’s the documentation page detailing this concept and providing an example for its application.