# Dash Callback Input and Output sharing the same component ID

**URL:** <https://community.plotly.com/t/dash-callback-input-and-output-sharing-the-same-component-id/51089>\
**Category:** Dash Python\
**Created:** [March 16, 2021, 2:00pm UTC](https://community.plotly.com/t/dash-callback-input-and-output-sharing-the-same-component-id/51089 "2021-03-16T14:00:31Z")\
**Posts on this page:** 8\
**Page:** 1

<div class="post-metadata">

**Author:** ![stef007](https://avatars.discourse-cdn.com/v4/letter/s/ed8c4c/32.png) [@stef007](https://community.plotly.com/u/stef007)\
**Post date:** [March 16, 2021, 2:00pm UTC](https://community.plotly.com/t/dash-callback-input-and-output-sharing-the-same-component-id/51089/1 "2021-03-16T14:00:31Z")

</div>

Here is the scenario I have,

1. Two dropdowns(Input) filtering DashTable as Output
2. Selecting DashTable Row (Input) to create a bar chart → fails

Property ID was used with component ID… in one of the Input items of a callback.  
This ID is assigned to a dash.DataTable component in the layout, which does not support this property.  
This ID was used in the callback for Output…

---

<div class="post-metadata">

**Author:** ![Eduardo](https://sea2.discourse-cdn.com/flex024/user_avatar/community.plotly.com/eduardo/32/13310_2.png) [@Eduardo](https://community.plotly.com/u/Eduardo)\
**Post date:** [March 16, 2021, 2:42pm UTC](https://community.plotly.com/t/dash-callback-input-and-output-sharing-the-same-component-id/51089/2 "2021-03-16T14:42:47Z")

</div>

@stef007

See if you can use State instead Input.

---

<div class="post-metadata">

**Author:** ![Azzam](https://avatars.discourse-cdn.com/v4/letter/a/b782af/32.png) [@Azzam](https://community.plotly.com/u/Azzam)\
**Post date:** [March 16, 2021, 2:51pm UTC](https://community.plotly.com/t/dash-callback-input-and-output-sharing-the-same-component-id/51089/3 "2021-03-16T14:51:46Z")

</div>

@stef007 yeah use State just as @Eduardo said. I was also changing multiple attributes like this,

```auto

@app.callback(
Output('time-slider','marks'),
Output('time-slider','max'),
[Input('update-graph', 'n_clicks')],
[State('time-slider', 'value')],
[State('dropdown-date', 'value')]
)
def updategraph(n_clicks,selectedtime):
     marks = {..} 
     max = 100
     return marks,max

```

---

<div class="post-metadata">

**Author:** ![stef007](https://avatars.discourse-cdn.com/v4/letter/s/ed8c4c/32.png) [@stef007](https://community.plotly.com/u/stef007)\
**Post date:** [March 17, 2021, 4:49pm UTC](https://community.plotly.com/t/dash-callback-input-and-output-sharing-the-same-component-id/51089/4 "2021-03-17T16:49:26Z")

</div>

well, I tried and that did not work for me… please allow me to explain:

first callback, the Output is filtered dash.DataTable

```auto
@app.callback(
    Output('partner-datatable', 'data'),
    [Input('crossfilter-teams', 'value'),
     Input('crossfilter-months', 'value')])

```

The other the Input is from that dash.DataTable, and the Output should be a chart corresponding to selected row

```auto
@app.callback(
    Output('partner-chart', 'figure'),
    Input('partner-datatable', 'selected_row_id'),
    Input('partner-datatable', 'active_cell'))

```

and that does not work

---

<div class="post-metadata">

**Author:** ![Eduardo](https://sea2.discourse-cdn.com/flex024/user_avatar/community.plotly.com/eduardo/32/13310_2.png) [@Eduardo](https://community.plotly.com/u/Eduardo)\
**Post date:** [March 17, 2021, 6:52pm UTC](https://community.plotly.com/t/dash-callback-input-and-output-sharing-the-same-component-id/51089/5 "2021-03-17T18:52:40Z")

</div>

@stef007

Here is not the issue, you are not shearing the same id, check if the problem is in an other part of the code.

---

<div class="post-metadata">

**Author:** ![stef007](https://avatars.discourse-cdn.com/v4/letter/s/ed8c4c/32.png) [@stef007](https://community.plotly.com/u/stef007)\
**Post date:** [March 18, 2021, 10:28pm UTC](https://community.plotly.com/t/dash-callback-input-and-output-sharing-the-same-component-id/51089/6 "2021-03-18T22:28:32Z")

</div>

Thank you for being so patient with me. However, when I do omit that last callback all is working well and I do not receive this error message:

> Property “selected\_row\_id” was used with component ID:  
> “partner-datatable”  
> in one of the Input items of a callback.  
> This ID is assigned to a dash\_table.DataTable component  
> in the layout, which does not support this property.  
> This ID was used in the callback(s) for Output(s):  
> partner-chart.figure

---

<div class="post-metadata">

**Author:** ![AnnMarieW](https://avatars.discourse-cdn.com/v4/letter/a/ec9cab/32.png) [@AnnMarieW](https://community.plotly.com/u/AnnMarieW)\
**Post date:** [March 18, 2021, 10:59pm UTC](https://community.plotly.com/t/dash-callback-input-and-output-sharing-the-same-component-id/51089/7 "2021-03-18T22:59:50Z")

</div>

Hi @stef007

The correct name for the prop is: `selected_row_ids` (plural 🙂 )

Try:

```auto
Input('partner-datatable', 'selected_row_ids'),
```

---

<div class="post-metadata">

**Author:** ![stef007](https://avatars.discourse-cdn.com/v4/letter/s/ed8c4c/32.png) [@stef007](https://community.plotly.com/u/stef007)\
**Post date:** [March 19, 2021, 5:26am UTC](https://community.plotly.com/t/dash-callback-input-and-output-sharing-the-same-component-id/51089/8 "2021-03-19T05:26:47Z")

</div>

Thank you so much, good catch. very much appreciated