title: Python plotly Dash updating/refreshing layout
body: <p>I have app that imports <code>layout</code> from second module then renders it in tab as returning <code>app.layout</code> to this tab content. I have problem with thing that layout is imported with default values of inputs and when I have inputs filled with keys and change between tabs then when I click back to the inputs tab the values reset to default 'x'. I managed to solve this problem by declaring layout second time in a callback but it doesn't look good and would require to write layout 2 times for further functionalities. There is my code:</p>
  
  <pre><code>if 'manager' not in vars():
      manager = Recognition('xx', 'xx')
      print('defining manager')
  
  lcheck = 0
  while lcheck == 0:
      layout = [
          html.Div([
              html.Div(
                  [
                      html.H3("Primary API key"),
                      dcc.Input(
                          id='primary-key',
                          value=manager.api_key,
                          placeholder='Enter a value...',
                          type='text',
                          style = {"width":"50%"}
                      ),
                      html.H3("Private API key"),
                      dcc.Input(
                          id='private-key',
                          value=manager.api_secret,
                          placeholder='Enter a value...',
                          type='text',
                          style = {"width":"50%"}
                      ),
  
  
                  ],
              ),
              html.Button('Submit', id='button', className='btn btn-primary'),
              html.Div(id='output-hidden')
          ])
      ]
      lcheck=1
  
  
  @app.callback(
      Output('primary-key', 'value'),
      [Input('button', 'n_clicks')],
      [State('primary-key', 'value'), 
       State('private-key', 'value')]
  )
  def update_output(n_clicks, value1, value2):
      values = {'value1':value1, 'value2':value2}
      global manager
      global layout
      manager.update(value1, value2)
      layout = [
          html.Div([
              html.Div(
                  [
                      html.H3("Primary API key"),
                      dcc.Input(
                          id='primary-key',
                          value=manager.api_key,
                          placeholder='Enter a value...',
                          type='text',
                          style = {"width":"50%"}
                      ),
                      html.H3("Private API key"),
                      dcc.Input(
                          id='private-key',
                          value=manager.api_secret,
                          placeholder='Enter a value...',
                          type='text',
                          style = {"width":"50%"}
                      ),
  
  
                  ],
              ),
              html.Button('Submit', id='button', className='btn btn-primary'),
              html.Div(id='output-hidden')
          ])
      ]
  
      lcheck=0
      return values['value1']
  </code></pre>
  
  <p>As you can see it saves new layout everytime I send new data with button but this solution looks terrible I would like to find better solution without chaos in code. Whole thing is to update <code>value=manager.api_key,</code> and <code>value=manager.api_secret,</code> in layout variable. I was thinking to get access of the values like from normal <code>list</code> but it is not possible since it is not nested as regular list. Is there any way to access the values for example <code>layout.getid("primary-key").value</code> or something like this? How to clean this code?</p>