<.form
for={@form}
phx-change="validate_strict"
phx-submit="save_strict"
>
<.select
class="select"
field={@form[:country]}
items={Corex.List.new([
%{label: "France", value: "fra"},
%{label: "Belgium", value: "bel"},
%{label: "Germany", value: "deu"},
%{label: "Netherlands", value: "nld"},
%{label: "Switzerland", value: "che"},
%{label: "Austria", value: "aut"}
])}
translation={%Corex.Select.Translation{placeholder: "Select a country"}}
on_value_change="select_country_changed_strict"
>
<:label>Country</:label>
<:trigger>
<.heroicon name="hero-chevron-down" class="icon" />
</:trigger>
<:error :let={msg}>
<.heroicon name="hero-exclamation-circle" class="icon" />
{msg}
</:error>
</.select>
<.action type="submit" class="button button--accent">
Submit
</.action>
</.form>
defmodule MyAppWeb.SelectFormLive do
use MyAppWeb, :live_view
def mount(_params, _session, socket) do
ecto_form =
%MyApp.Forms.CountryForm{}
|> MyApp.Forms.CountryForm.changeset_validate(%{})
|> Phoenix.Component.to_form(as: :select_ecto, id: "select-live-form-ecto")
{:ok, assign(socket, :ecto_form, ecto_form)}
end
def handle_event("select_country_changed", %{"value" => value}, socket) do
country = List.first(value) || ""
validate_ecto(socket, %{"country" => country})
end
def handle_event("validate", %{"select_ecto" => params}, socket) do
validate_ecto(socket, params)
end
def handle_event("save", %{"select_ecto" => params}, socket) do
case MyApp.Forms.CountryForm.changeset_validate(%MyApp.Forms.CountryForm{}, params) do
%Ecto.Changeset{valid?: true} = changeset ->
_data = Ecto.Changeset.apply_changes(changeset)
{:noreply,
assign(
socket,
:ecto_form,
Phoenix.Component.to_form(
MyApp.Forms.CountryForm.changeset_validate(%MyApp.Forms.CountryForm{}, params),
as: :select_ecto,
id: "select-live-form-ecto"
)
)}
%Ecto.Changeset{} = changeset ->
{:noreply,
assign(
socket,
:ecto_form,
Phoenix.Component.to_form(changeset, action: :insert, as: :select_ecto, id: "select-live-form-ecto")
)}
end
end
defp validate_ecto(socket, params) do
changeset =
%MyApp.Forms.CountryForm{}
|> MyApp.Forms.CountryForm.changeset_validate(params)
|> Map.put(:action, :validate)
{:noreply,
assign(
socket,
:ecto_form,
Phoenix.Component.to_form(changeset, action: :validate, as: :select_ecto, id: "select-live-form-ecto")
)}
end
end
defmodule MyApp.Forms.CountryForm do
use Ecto.Schema
import Ecto.Changeset
embedded_schema do
field :country, :string
end
def changeset(form, attrs \\ %{}) do
form
|> cast(attrs, [:country])
|> validate_required([:country])
end
def changeset_validate(form, attrs \\ %{}) do
form
|> cast(attrs, [:country])
|> validate_required([:country], message: "can't be blank")
end
end