Basic form components - how to render input controls?

Phoenix Forum Questions / Help
,
1

I’m very new to Phoenix and am reading a project written by someone else. I’m trying to understand how to render input controls. I see this:

          <.input
            type="select"
            label="Format"
            options={["Table", "Raw", "Discord"]}
            name="message-format"
            value={@filters["message-format"]}
            phx-change="format-update"
          />

How does this differ from using <input instead? Are they interchangeable?

2

Unless they’ve moved it, you should be able to find the definition of input in lib/app_web/components/core_components.ex.

The code in question is actually rendering a select box as per type="select". input is designed to cover all types of form inputs but since it’s generated code, you can change this if you want. For selects it takes care of creating the <option> tags via the options={...} attribute there. It’s hard to say without seeing the code but I assume @filters is not a %Form{} object, so that is why they are explicitly passing name and value. Most of the time, though, you can simply do field={@form[:message_format]} without passing name and value.

1 Like