i-n-g-m-a-r
Phoenix.HTML.Form pass custom assigns (key={value})
Suppose one defines a simple form like this:
<.simple_form :let={f} for={@changeset} focus={@focus}>
Then how would one collect the @focus value when defining an input:
<.input field={f[:name]} type="text" focus={@focus} />
Annotating simple_form/1 does not work.
attr :focus, :atom, default: nil
<.form :let={f} for={@for} as={@as} focus={@focus} {@rest}>
Phoenix.HTML.Form does not pass @focus or any custom value along.
Using @rest results in @focus being output as a form attribute.
So how does one trickle down key={value} ?
Many thanks.
First Post!
LostKobrakai
You don’t need to pass the value to <.simple_form> in the first place. You can pass it to the input directly and that’s enough.
Last Post!
i-n-g-m-a-r
Thanks again.
So in conclusion as long as we are in control of a function we can define key={value} syntax.
When using form/1 or other functions out of our control we cannot use it.
Unless we do weird stuff like:
<.simple_form :let={f} for={@changeset} data-focus={get_focus(@changeset, [:field_b, :field_c, :field_a])}>
and
<input type={@type} autofocus={has_focus?(@__given__)}>
and
def has_focus?(%{__given__: %{field: %{field: name, form: %{options: opts}}}}) do
opts[:"data-focus"] == name
end
def has_focus?(_), do: false
and accept a data-focus attribute on our form.
Popular in Questions
Other popular topics
Latest Phoenix Threads
Latest on Elixir Forum
Sponsor Spotlight
Phoenix, LiveView, multimedia pipelines, distributed systems. 400 engineers, Elixir since 2017. Available for hire.
Categories:
Sub Categories:
Forums
Popular Tags
- #ecto
- #liveview
- #troubleshooting
- #learning-elixir
- #deployment
- #library
- #erlang
- #testing
- #genserver
- #mix
- #absinthe
- #remote-other
- #otp
- #plug
- #how-to-question
- #macros
- #postgres
- #channels
- #elixirconf
- #exunit
- #discussion
- #code-sync
- #javascript
- #podcasts
- #onsite
- #dialyzer
- #docker
- #authentication
- #umbrella
- #full-time-contract
- #podcasts-by-brainlid
- #ecto-query
- #elixir-ls
- #phoenix_html
- #iex
- #blog-post
- #graphql
- #genstage
- #ai
- #websockets
- #supervisor
- #elixirconf-us
- #advent-of-code
- #distillery
- #processes
- #api
- #forms
- #metaprogramming
- #security
- #hex
Our Sponsors
Build Elixir applications with speed and confidence.
Supporting innovation across the BEAM ecosystem.
We build reliable cloud platforms for business-critical systems.
Catch errors, track performance, monitor hosts and more.
Error tracking, logs, uptime, and Just Enough APM. Built for developers.
Practical resources that improve the lives of professional developers.
Develop your skills with books, videos, and courses.
Producing high quality Elixir screencasts since 2017.
The team behind Membrane, Popcorn, LiveDebugger. Available for hire.
Courses that'll move you from confusion to "Aha, now I get it!"