Checkbox · Form

    <.form for={@phoenix_form} phx-submit="save_phoenix">
  <.checkbox field={@phoenix_form[:terms]} class="checkbox" id="checkbox-live-form-phoenix-terms">
    <:label>Accept terms</:label>
  </.checkbox>
  <.action type="submit" id="checkbox-live-form-phoenix-submit" class="button button--accent">
    Submit
  </.action>
</.form>

  

    defmodule MyAppWeb.CheckboxFormLive do
  use MyAppWeb, :live_view

  def mount(_params, _session, socket) do
    phoenix_form =
      Phoenix.Component.to_form(%{"terms" => false},
        as: :terms_phoenix,
        id: "checkbox-live-form-phoenix"
      )

    {:ok, assign(socket, :phoenix_form, phoenix_form)}
  end

  def handle_event("save_phoenix", %{"terms_phoenix" => params}, socket) do
    terms = Phoenix.HTML.Form.normalize_value("checkbox", params["terms"])

    {:noreply,
     assign(
       socket,
       :phoenix_form,
       Phoenix.Component.to_form(%{"terms" => terms},
         as: :terms_phoenix,
         id: "checkbox-live-form-phoenix"
       )
     )}
  end
end

  

    <.form for={@ecto_form} phx-change="validate" phx-submit="save">
  <.checkbox field={@ecto_form[:terms]} class="checkbox" id="checkbox-live-form-ecto-terms">
    <:label>Accept terms</:label>
    <:error :let={msg}>
      <.heroicon name="hero-exclamation-circle" class="icon" />
      {msg}
    </:error>
  </.checkbox>
  <.action type="submit" id="checkbox-live-form-ecto-submit" class="button button--accent">
    Submit
  </.action>
</.form>

  

    defmodule MyAppWeb.CheckboxFormLive do
  use MyAppWeb, :live_view

  def mount(_params, _session, socket) do
    ecto_form =
      %MyApp.Forms.Terms{}
      |> MyApp.Forms.Terms.changeset_validate(%{})
      |> Phoenix.Component.to_form(as: :terms_ecto, id: "checkbox-live-form-ecto")

    {:ok, assign(socket, :ecto_form, ecto_form)}
  end

  def handle_event("validate", %{"terms_ecto" => params}, socket) do
    changeset =
      %MyApp.Forms.Terms{}
      |> MyApp.Forms.Terms.changeset_validate(params)
      |> Map.put(:action, :validate)

    {:noreply,
     assign(
       socket,
       :ecto_form,
       Phoenix.Component.to_form(changeset,
         action: :validate,
         as: :terms_ecto,
         id: "checkbox-live-form-ecto"
       )
     )}
  end

  def handle_event("save", %{"terms_ecto" => params}, socket) do
    case MyApp.Forms.Terms.changeset_validate(%MyApp.Forms.Terms{}, params) do
      %Ecto.Changeset{valid?: true} = changeset ->
        {:noreply,
         assign(
           socket,
           :ecto_form,
           Phoenix.Component.to_form(
             MyApp.Forms.Terms.changeset_validate(%MyApp.Forms.Terms{}, params),
             as: :terms_ecto,
             id: "checkbox-live-form-ecto"
           )
         )}

      changeset ->
        {:noreply,
         assign(
           socket,
           :ecto_form,
           Phoenix.Component.to_form(changeset,
             action: :insert,
             as: :terms_ecto,
             id: "checkbox-live-form-ecto"
           )
         )}
    end
  end
end

  

    defmodule MyApp.Forms.Terms do
  use Ecto.Schema
  import Ecto.Changeset

  embedded_schema do
    field :terms, :boolean, default: false
  end

  def changeset(terms, attrs \\ %{}) do
    terms
    |> cast(attrs, [:terms])
    |> validate_required([:terms])
    |> validate_acceptance(:terms)
  end

  def changeset_validate(terms, attrs \\ %{}) do
    terms
    |> cast(attrs, [:terms])
    |> validate_required([:terms], message: "can't be blank")
    |> validate_acceptance(:terms, message: "must be accepted to continue")
  end
end