maqnius
Using Phoenix.HTML.Form for M2M-Relations using a Multiple Select Input in a LiveView
Hey there ![]()
I was trying to adapt the Contexts Article using the Form Struct and to_form.
I ended up having problems to render the input
<.input
field={@form[:categories]}
type="select"
multiple={true}
options={category_options(@article)}
/>
It errors like this
** (Protocol.UndefinedError) protocol Phoenix.HTML.Safe not implemented for type Ecto.Changeset (a struct).
because the value of the field @form[:categories] contains a Category changeset, introduced by the change_article\2 function - which is taken from the Context Article
def change_article(%Article{} = article, attrs \\ %{}) do
categories = list_categories_by_id(attrs["categories"])
article
|> Repo.preload(:categories)
|> Article.changeset(attrs)
|> Ecto.Changeset.put_assoc(:categories, categories)
end
Phoenix tries to render the value in the select component but the changeset doesn’t help much here
def input(%{type: "select"} = assigns) do
~H"""
<fieldset class="fieldset mb-2">
<label>
<span :if={@label} class="fieldset-label mb-1">{@label}</span>
<select
id={@id}
name={@name}
class={["w-full select", @errors != [] && "select-error"]}
multiple={@multiple}
{@rest}
>
<option :if={@prompt} value="">{@prompt}</option>
{Phoenix.HTML.Form.options_for_select(@options, @value)}
</select>
</label>
<.error :for={msg <- @errors}>{msg}</.error>
</fieldset>
"""
end
I guess, I understand the problem, but I’m unsure how to proceed from here. I wasn’t very successfull finding examples using to_form.
What should I change, the input template, the form template, the change_article function or something else?
Thank you for help <3
Marked As Solved
jdiago
I think the select is supposed to be for @form[:category_ids].
The many_to_many :categories in the schema takes the categories key for itself so you can’t use it.
Also Liked
jdiago
In Phoenix, if you want to sketch out a form quickly, you can use to_form(%{}, as: "some_name"). You can then put whatever inputs to shape the params however you like.
Last Post!
LostKobrakai
Yeah, there’s docs for that on the function documentation for <.inputs_for>, eventually you also want to avoid allowing duplicate category selection. But that doesn’t concern the form input anymore. It’s all just presentation logic and constraints.
Popular in Questions
Other popular topics
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









