title: Several inputs for one single call back (dash, python, bootstrap)
body: <p>I am currently working on a website and I am using python, dash and bootstrap. I am making cards from bootstrap for hundreds of items. The problem is on each cards there is an edit button that when clicked will pop up a modal with the information on that item. I have no clue on how to create one callback for for every single one of these items.</p>
  
  <pre><code>from collections import OrderedDict
  import dash
  import pandas as pd
  import dash_bootstrap_components as dbc
  import dash_core_components as dcc
  import dash_html_components as html
  from dash.dependencies import Input, Output, State
  
  def card_maker(site_number):
      return dbc.Card(
              dbc.CardBody([
                  html.H4(site_number,style={'display':'inline-block'}),
                  dbc.Button("Edit", id="open-xl"+site_number, color="secondary", className="button-
                              style",style={'margin-right':'10px','display':'inline-
                              block','float':'right'}),
                  dbc.Modal(
                  [
                      dbc.ModalHeader(site_number),
                      dbc.ModalBody("Information"),
                      dbc.ModalFooter(
                              dbc.Button("Close", id="close-xl"+site_number, className="ml-auto"+site_number)
                          ),
                      ],
                      id="modal-xl" +site_number,
                      size="xl",
                  ),
              ]
              ),
              className="mb-3",
              id = "card-" + site_number
          )
  
  cards = html.Div(
      [
          card_maker(site_number) for site_number in site_numbers #Site numbers is a list of unique numbers all of equal length
  
      ],
      id = 'cards',
      className="cards",
      style={'padding-left':'150px','padding-right':'150px', "overflowY": "scroll", 'maxHeight': '650px'}
  )
  
  def toggle_modal(n1, n2, is_open):
      if n1 or n2:
          return not is_open
      return is_open
  
  for eng_num in site_numbers:
      app.callback(
          Output("modal-xl"+ num, "is_open"),
          [Input("open-xl"+ num, "n_clicks"), Input("close-xl"+ num, "n_clicks")],
          [State("modal-xl"+ num, "is_open")],
      )(toggle_modal)
  </code></pre>
  
  <p>I created unique id's for every card and every single model and this code above works but only for a small amount of cards. I will be working with close to 1000+ cards on my site. </p>
  
  <p>When I have over around 100 then the site fails to load. If anyone has any code or ideas on how to make multiple buttons like this that all do basically the same action, then please share it.</p>