Troubles setting up `select` and `option` fields in LiveView's HTML.

[covert vale]

Hello, I'm very new to Phoenix and Elixir, but I'm trying to learn by doing.

I have been going through the mix phx.gen.live to generate the live show, update and delete screens, but it doesn't show all fields that are in my database.

My Player object looks like the following

defmodule Test.Player do
  use Ecto.Schema
  alias Test.Club
  import Ecto.Changeset

  schema "players" do
    field :contact, :string
    field :date_of_birth, :date
    field :name, :string
    field :surname, :string
    belongs_to :club, Club

    timestamps(type: :utc_datetime)
  end

  @doc false
  def changeset(player, attrs) do
    player
    |> cast(attrs, [:name, :surname, :contact, :date_of_birth])
    |> validate_required([:name, :surname, :contact, :date_of_birth])
  end
end

the Club looks like this

defmodule Test.Club do
  use Ecto.Schema
  import Ecto.Changeset

  schema "clubs" do
    field :name, :string

    timestamps(type: :utc_datetime)
  end

  @doc false
  def changeset(club, attrs) do
    club
    |> cast(attrs, [:name])
    |> validate_required([:name])
  end
end

I'd like to also show that :club variable inside of that edit player screen.

I have tried adding different ways of adding the club.id and club.name to the select and option fields, but I've had no luck this far.

      <.simple_form
        for={@form}
        id="player-form"
        phx-target={@myself}
        phx-change="validate"
        phx-submit="save"
      >
        <.input field={@form[:name]} type="text" label="Name" />
        <.input field={@form[:surname]} type="text" label="Surname" />
        <.input field={@form[:contact]} type="text" label="Contact" />
        <.input field={@form[:date_of_birth]} type="date" label="Date of birth" />
        # <.select field={@form[:club]}>
          <%= options_for_select(Enums.map(@clubs, &{&1.id, &1.name}), @form[:club]) %>
          # <%= for club <- @clubs do %>
          #   <option values={club.id}><%= club.name %></option>
          # <% end %>
        # </.select>
        <:actions>
          <.button phx-disable-with="Saving...">Save Player</.button>
        </:actions>
      </.simple_form>

And I've had to add clubs to the assign_form function

defp assign_form(socket, %Ecto.Changeset{} = changeset) do
  clubs = ClubListing.list_clubs();
  assign(socket, form: to_form(changeset), clubs: clubs)
end

[frank umbra]

Here's an example of a drop down in live view:

<.input
          field={@form[:gender]}
          type="select"
          label="Gender"
          options={[{"Male", :male}, {"Female", :female}, {"Other", :other}]}
          required
        />

In my schema, I define gender like this:

field(:gender, Ecto.Enum, values: [:male, :female, :other], default: :male)

As to showing connected information, you can setup a query in your backend with preload keyword... here's an example:

def get_org_details(id) do
    q =
      from o in Organization,
        join: owner in assoc(o, :owner),
        where: o.id == ^id,
        preload: [owner: owner]

    Repo.all(q)
  end

In this case, when you fetch the pre-existing player and want to load their club details, preload the club and then you'll have access to it in the club field. Then build it out in the view as you'd like