phoebe
Text Input field with dynamic placeholder
Hi,
In my html.eex template form, I have a text_input form input and would like to pass to the placeholder a value based on some other field from the form (previously saved before form is rendered). I would like to do something like the following - have a :username field with a placeholder of the :first_name field value, but the placeholder variable is not recognised here:
<%= form_for @changeset, @action, fn f -> %>
<%= text_input f, :username, placeholder: :first_name %>
...
<% end %>
Is this possible to do with the text_input macro or do I need to use the tag macro? Thanks!
Marked As Solved
kokolegorille
If You know the value of first_name, pass it as a variable in the controller…
:first_name is only an atom, pass it, and use it as @first_name.
If You want to use conditional rendering on the same form… You will need some JS skill… or LiveView, or Drab, or any server side libs that can potentially update DOM.
Also Liked
OvermindDL1
If you are wanting :first_name to pull from a key on your changeset/whatever named first_name then you can always do this:
<%= form_for @changeset, @action, fn f -> %>
<%= text_input f, :username, placeholder: input_value(f, :first_name) %>
...
<% end %>
And that will compile the value in as the placeholder. If you want it to update ‘on the page’ then that’s a Javascript thing, so either a some javascript, drab, live_view, etc… 
phoebe
Thanks! Very helpful indeed, input_value is easier than passing variable into a controller
Last Post!
phoebe
Thanks! Very helpful indeed, input_value is easier than passing variable into a controller
Popular in Questions
Other popular topics
Latest Phoenix Threads
Latest on Elixir Forum
Sponsor Spotlight
Build Elixir applications with speed and confidence.
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
- #forms
- #api
- #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 for Elixir devs who love to ship. Start your free account.
Develop your skills with books, videos, and courses.
Producing high quality Elixir screencasts since 2017.
Enabling companies to succeed by building software people love.
The team behind Membrane, Popcorn, LiveDebugger. Available for hire.
Courses that'll move you from confusion to "Aha, now I get it!"