Question: Is there a default value that a option can have in select component? I am using LiveView
<.input field={@form[:theme]} value={"Roxo"} type="select"
options={[
{gettext("Vermelho Padrão"), "default_theme"}, {gettext("Roxo"), "purple_theme"}, {"Verde", "green_theme"}
]} />
> GITHUB: core_components.ex
I took reference from this. I am not sure if .input is the best approach for what i wanted to do, then i am using select for this this case where i need default value 
Way out: <select id="theme" name="theme" class="" multiple > {Phoenix.HTML.Form.options_for_select([{"Roxo", "purple_theme"}, {"Vermelho Padrão", "default_theme"}], @theme )} </select>
I dont know how to make select have a dropdown menu as .input
Phoenix.HTML.Form
Found this at core_components.ex def input(%{type: "select"} = assigns) do ~H""" <div> <.label for={@id}>{@label}</.label> <select id={@id} name={@name} class="mt-2 block w-full rounded-md border border-gray-300 bg-white shadow-sm focus:border-zinc-400 focus:ring-0 sm:text-sm" multiple={@multiple} {@rest} > <option :if={@prompt} value="">{@prompt}</option> {Phoenix.HTML.Form.options_for_select(@options, @value)} </select> <.error :for={msg <- @errors}>{msg}</.error> </div> """ end
remove “multiple” from select and dropdown works: <select id="theme" name="theme" class=""> {Phoenix.HTML.Form.options_for_select([{"Roxo", "purple_theme"}, {"Vermelho Padrão", "default_theme"}], @theme )} </select>
other way around:
<.form for={@form} id="main-form" phx-submit="save" phx-change="validate" class="space-y-6">
<div >
<label>@privacy_options</label>
<.input field={@form[:theme]} type="select" options={@theme_options} />
</div>
</.form>
To set a default value, you do this in the form.
def mount(_params, _session, socket)
changeset = User.changeset(user, %{theme: "Dark"})
{:ok, assign(socket, form: to_form(changeset))}
If you are looking to set a default value that isn’t one of the options, you can add a prompt
. Ie ‘Choose xxx’
<.input
field={@form[:theme]}
type="select"
prompt="Choose a theme..."
options={["Light", "Dark"]}
/>
2 Likes