المفتاح · النموذج
Phoenix
<.form
for={@form}
action={~p"/switch/form"}
method="post"
>
<.switch field={@form[:notifications]} class="switch">
<:label>Enable notifications</:label>
<:error :let={msg}>
<.heroicon name="hero-exclamation-circle" class="icon" />
{msg}
</:error>
</.switch>
<.action type="submit" class="button button--accent">
Submit
</.action>
</.form>
def switch_form_page(conn, _params) do
phoenix_form =
Phoenix.Component.to_form(%{"notifications" => false},
as: :preferences_phoenix,
id: "switch-form-phoenix"
)
render(conn, :switch_form_page, phoenix_form: phoenix_form)
end
def switch_form_submit(conn, params) do
if is_map(params["preferences_phoenix"]) do
notifications = params["preferences_phoenix"]["notifications"] in [true, "true", "on", "1", 1]
conn
|> put_flash(:info, "Submitted: notifications=#{inspect(notifications)}")
|> redirect(to: ~p"/switch/form#switch-form-phoenix")
end
end
نموذج Phoenix (changeset)
<.form
for={@form}
action={~p"/switch/form"}
method="post"
>
<.switch field={@form[:notifications]} class="switch">
<:label>Enable notifications</:label>
<:error :let={msg}>
<.heroicon name="hero-exclamation-circle" class="icon" />
{msg}
</:error>
</.switch>
<.action type="submit" class="button button--accent">
Submit
</.action>
</.form>
def switch_form_page(conn, _params) do
ecto_form =
%MyApp.Forms.Preferences{}
|> MyApp.Forms.Preferences.changeset_validate(%{})
|> Phoenix.Component.to_form(as: :preferences_ecto, id: "switch-form-ecto")
render(conn, :switch_form_page, ecto_form: ecto_form)
end
def switch_form_submit(conn, params) do
if is_map(params["preferences_ecto"]) do
changeset =
%MyApp.Forms.Preferences{}
|> MyApp.Forms.Preferences.changeset_validate(params["preferences_ecto"] || %{})
if changeset.valid? do
data = Ecto.Changeset.apply_changes(changeset)
conn
|> put_flash(:info, "Submitted: notifications=#{inspect(data.notifications)}")
|> redirect(to: ~p"/switch/form#switch-form-ecto")
else
changeset = Map.put(changeset, :action, :insert)
ecto_form = Phoenix.Component.to_form(changeset, as: :preferences_ecto, id: "switch-form-ecto")
render(conn, :switch_form_page, ecto_form: ecto_form)
end
end
end
defmodule MyApp.Forms.Preferences do
use Ecto.Schema
import Ecto.Changeset
embedded_schema do
field :notifications, :boolean, default: false
end
def changeset(form, attrs \\ %{}) do
form
|> cast(attrs, [:notifications])
|> validate_acceptance(:notifications)
end
def changeset_validate(form, attrs \\ %{}) do
form
|> cast(attrs, [:notifications])
|> validate_acceptance(:notifications, message: "must be accepted to continue")
end
end
Native HTML Form
<form
action={~p"/switch/form"}
method="post"
>
<input type="hidden" name="_csrf_token" value={Plug.CSRFProtection.get_csrf_token()} />
<.switch
name="user[notifications]"
class="switch"
>
<:label>Enable notifications</:label>
</.switch>
<.action type="submit" class="button button--accent">
Submit
</.action>
</form>
def switch_form_submit(conn, %{"user" => %{"notifications" => notifications}}) do
conn
|> put_flash(:info, "Submitted: notifications=#{inspect(notifications)}")
|> redirect(to: ~p"/switch/form#switch-form-native")
end