selected attribute for dbc.Select

[arjun289]

Hey folks,

So at the moment, there is no option to pre-select an element on a select dropdown, something which can be done in HTML5 with the following syntax:

<label for="pet-select">Choose a pet:</label>

<select name="pets" id="pet-select">
  <option value="">--Please choose an option--</option>
  <option value="dog" selected>Dog</option>
  <option value="cat" >Cat</option>
  <option value="hamster" >Hamster</option>
  <option value="parrot">Parrot</option>
  <option value="spider">Spider</option>
  <option value="goldfish">Goldfish</option>
</select>

In the above example, I can show the "dog" as the pre-selected value by setting the selected attribute, however I couldn't do the same with dbc.Select. Or it could be that I am missing something.

[tcbegley]

Hi @arjun289

Please accept my apologies for the delay in responding to you. In case this is still causing you problems, you can simply set value="dog" inside the select. This will set the initial value accordingly. Example below

import dash_bootstrap_components as dbc
from dash import Dash

ANIMALS = ["dog", "cat", "hamster", "parrot", "spider", "goldfish"]

app = Dash(external_stylesheets=[dbc.themes.BOOTSTRAP])

app.layout = dbc.Container(
    dbc.Select(
        options=[
            {"label": animal.capitalize(), "value": animal}
            for animal in ANIMALS
        ],
        value="dog",
    ),
    className="p-5",
)

if __name__ == "__main__":
    app.run_server(debug=True)