Update disabled attribute in select form

Questions / Help
1

Looking for an update of the post How can I add "disabled" attribute to a Phoenix.HTML.Form select prompt option? - #7 by Kurisu, with LiveView 0.19.5 and core components. I don’t want to submit the form when the select option value is empty.

mount  ===> assign(socket, form: to_form(%{"symbol" => ""})

attr :symbol, :string, required: true

<.simple_form 
   id="form-for-symbol" 
   for={@form} 
   phx-submit="start-stream" 
   phx-change="change-stream">
   <.input
      type="select"
      prompt="please select a symbol"
      autofocus
      options={@symbols}
      field={@form[:symbol]}
   >
   </.input>
   <:actions>
      <.button>Go</.button>
   </:actions>
</.simple_form>

You can set a disabled attribute on an input or button, but I can’t set an attribute “disabled=something” in the <.input> component nor in the <.button>, at least when something is {@form[:field].value == ""}.

You can capture the case of the input field being empty and not submit. Did someone solved this in the HTML?

2

It sounds like you should simply mark the input itself as required and then the browser will prevent the form from submitting until it has a value.

3

Sounds good…