そこで、動的フォームを作成するためのこのチュートリアルに従いました: http://blog.plataformatec.com.br/2016/09/dynamic-forms-with-phoenix/
さて、これは私の実際のものinput_helpers.ex
です:
defmodule Conts.InputHelpers do
@moduledoc """
Define <%= input f, :pass, type: :password_input %> syntax
to create dynamic form inputs
"""
use Phoenix.HTML
alias Phoenix.HTML.Form, as: PhxForm
import ContsWeb.ErrorHelpers, only: [error_tag: 2]
@label_opts "basic-form-label"
@input_opts "basic-form-input"
def input(form, field, opts \\ []) do
label_text = opts[:label] || humanize(field)
type = opts[:type] || PhxForm.input_type(form, field)
additional_classes = opts[:class] || ""
label_opts = [class: @label_opts]
input_opts = [
class: "#{@input_opts} #{state_class(form, field)} #{additional_classes}",
id: opts[:id]
]
label_opts = if opts[:id], do: [for: opts[:for]] ++ label_opts, else: label_opts
content_tag :fieldset do
label = label(form, field, label_text, label_opts)
input = input(type, form, field, input_opts)
error = error_tag(form, field)
error = if Enum.empty?(error), do: "", else: error
[label, input, error]
end
end
defp state_class(form, field) do
cond do
# The form was not yet submitted
!form.action -> ""
form.errors[field] -> "border-red-500"
# we don't need any additional style at all
# only with focus:within
true -> ""
end
end
# Implement clauses below for custom inputs.
# defp input(:datepicker, form, field, input_opts) do
# raise "not yet implemented"
# end
defp input(:password_confirmation, form, field, input_opts) do
apply(PhxForm, :password, [form, field, input_opts])
end
defp input(type, form, field, input_opts) do
apply(PhxForm, type, [form, field, input_opts])
end
end
このプロジェクトには、1対 1 の関係をcliente
持つuser
スキーマがあります。
ライブ ビュー テンプレートでは、次のようにしました。
<%= input f, :nome, label: "Nome completo", phx_debounce: "blur" %>
<%= input f, :telefone, label: "Número de telefone", phx_debounce: "blur", class: "mobile-masked" %>
<%= inputs_for f, :user, fn u -> %>
<%= input u, :email, phx_debounce: "blur" %>
<%= input u, :password, label: "Senha", phx_debounce: "blur" %>
<%= input u, :password_confirmation, label: "Confirme a Senha", phx_debounce: "blur" %>
<% end %>
最初の 2 つのフィールドは変更セットからのものでcliente
、その他は変更セットからのものuser
です。検証が開始されると、ユーザーは入力を入力し始めます。のフィールドはクラスをcliente
正しく適用しますが、 のフィールドは適用しません!border-red-500
user
私はそれをデバッグし、ユーザー変更セットの任意のフィールドを検証しようとすると、 のstate_class
関数で、句input_helpers.ex
に該当することがわかりました。!form.acton
私の質問は、このネストされたフォーム アクションをどのように処理できますか? なぜそれが前述のcond
条項に該当するのですか?