CarlosIribar

CarlosIribar

Hi! I’m new in Phoenix and Liveview. I’m trying to create a form using a changeset but I don’t know why the input core component can’t find the name, id, value, etc key.

Here is my form:

<.simple_form :let={f} for={@changeset |> dbg()} id="promo-form" phx-change="validate" phx-submit="save">
    <.input field={{f, :first_name} |> dbg()} type="text" label="First Name" />
    <.input field={{f, :email}} type="email" label="Email" phx-debounce="blur" />
    <:actions>
      <.button phx-disable-with="Sending...">Send Promo</.button>
    </:actions>
  </.simple_form>

And here is the error:
key :name not found in: %{changed: nil, given: %{changed: nil, field: {%Phoenix.HTML.Form{source: #Ecto.Changeset<action: nil, changes: %{}, errors: [first_name: {“can’t be blank”, [validation: :required]}, email: {“can’t be blank”, [validation: :required]}], data: #Pento.Promo.Recipient<>, valid?: false>, impl: Phoenix.HTML.FormData.Ecto.Changeset, id: “promo-form”, name: “recipient”, data: %Pento.Promo.Recipient{email: nil, first_name: nil}, hidden: , params: %{}, errors: , options: [method: “post”, id: “promo-form”, multipart: false, “phx-change”: “validate”, “phx-submit”: “save”], index: nil, action: nil}, :first_name}, label: “First Name”, type: “text”}, errors: , field: {%Phoenix.HTML.Form{source: #Ecto.Changeset<action: nil, changes: %{}, errors: [first_name: {“can’t be blank”, [validation: :required]}, email: {“can’t be blank”, [validation: :required]}], data: #Pento.Promo.Recipient<>, valid?: false>, impl: Phoenix.HTML.FormData.Ecto.Changeset, id: “promo-form”, name: “recipient”, data: %Pento.Promo.Recipient{email: nil, first_name: nil}, hidden: , params: %{}, errors: , options: [method: “post”, id: “promo-form”, multipart: false, “phx-change”: “validate”, “phx-submit”: “save”], index: nil, action: nil}, :first_name}, id: nil, inner_block: , label: “First Name”, multiple: false, prompt: nil, rest: %{}, type: “text”}

The core component:

def input(assigns) do
    ~H"""
    <div phx-feedback-for={@name}>
      <.label for={@field.id}><%= @label %></.label>
      <input
        type={@type}
        name={@name}
        id={@id}
...

I don’t know if this is because my changeset is schemaless because I this this component working to register a user for example

defmodule Pento.Promo.Recipient do
  import Ecto.Changeset

  @types %{email: :string, first_name: :string}
  defstruct [:email, :first_name]

  def changeset(%__MODULE__{} = user, attrs) do
    {user, @types}
    |> cast(attrs, Map.keys(@types))
    |> validate_required([:first_name, :email])
    |> validate_format(:email, ~r/@/)
  end
end

Showing Posts 1 to 5

tomkonidas

tomkonidas

You would need to also add a name to the input/1. As we see in the component it is expecting @name to be set, so we can pass it in like so:

 <.input name="first_name" field={{f, :first_name}} type="text" label="First Name" />
 <.input name="email" field={{f, :email}} type="email" label="Email" phx-debounce="blur" />
tomkonidas

tomkonidas

After looking at the component, the field should be something like this

  <.input field={f[:email]} label="Email"/>
CarlosIribar

CarlosIribar OP

@tomkonidas I add the name then the error is about the value:
Example:
<.input field={{f, :first_name} |> dbg()} name={f.name} type="text" label="First Name" />
Error:
key :value not found in: %{changed: nil, given: %{changed: nil, field: {%Phoenix.HTML.Form{source: #Ecto.Changeset<action: nil, changes: %{}, errors: [first_name: {“can’t be blank”, [validation: :required]}, email: {“can’t be blank”, [validation: :required]}], data: #Pento.Promo.Recipient<>, valid?: false>, impl: Phoenix.HTML.FormData.Ecto.Changeset, id: “promo-form”, name: “recipient”, data: %Pento.Promo.Recipient{email: nil, first_name: nil}, hidden: , params: %{}, errors: , options: [method: “post”, id: “promo-form”, multipart: false, “phx-change”: “validate”, “phx-submit”: “save”], index: nil, action: nil}, :first_name}, label: “First Name”, name: “recipient”, type: “text”}, errors: , field: {%Phoenix.HTML.Form{source: #Ecto.Changeset<action: nil, changes: %{}, errors: [first_name: {“can’t be blank”, [validation: :required]}, email: {“can’t be blank”, [validation: :required]}], data: #Pento.Promo.Recipient<>, valid?: false>, impl: Phoenix.HTML.FormData.Ecto.Changeset, id: “promo-form”, name: “recipient”, data: %Pento.Promo.Recipient{email: nil, first_name: nil}, hidden: , params: %{}, errors: , options: [method: “post”, id: “promo-form”, multipart: false, “phx-change”: “validate”, “phx-submit”: “save”], index: nil, action: nil}, :first_name}, id: nil, inner_block: , label: “First Name”, multiple: false, name: “recipient”, prompt: nil, rest: %{}, type: “text”}

<.label for={@id}><%= @label %></.label>
      <input
        type={@type}
        name={@name}
        id={@id}
        value={Phoenix.HTML.Form.normalize_value(@type, @value)}
        class={[
          "mt-2 block w-full rounded-lg text-zinc-900 focus:ring-0 sm:text-sm sm:leading-6",
          "phx-no-feedback:border-zinc-300 phx-no-feedback:focus:border-zinc-400",
          @errors == [] && "border-zinc-300 focus:border-zinc-400",
          @errors != [] && "border-rose-400 focus:border-rose-400"

And adding a value={f.value} doesn’t fix it.

tomkonidas

tomkonidas

Try passing in your input fields like:

field={f[:key_on_changeset]}
CarlosIribar

CarlosIribar OP

:fire: Thanks!

— All posts loaded —

Where Next? Top

Trending in Questions Top

katta
I having some trouble figuring out if I have set myself too strict of standards for my production server. Currently I can handle 75% of r...
New
brecabral
Documentation While reading the Scoped Routes section, I noticed that the documentation currently refers to a problem without explainin...
New
achenet
Hello, I’m trying to build a basic Phoenix web-app, and I’d like to use Tailwind. However, when I launch mix phx.server, I get an error...
New
kpanic
Hi everyone, I am toying with the idea of building a “match maker” for giving personal help to people that wants to start coding. I sta...
New
asweet-confluent
I recently noticed that Elixir’s Logger defaults its primary log level to :debug when no :logger, :level application configuration is pre...
New
Cxx-mlr
I’m working on a small exercise involving update_in/3, and I came up with this solution: data = %{ name: "Periodic Table", category:...
New
ChrisAmelia
I’ve got trouble wrapping my head around the order in which functions are called in this snippet (from Phoenix’s authentication): toke...
New

Other Trending Topics Top

GenericJam
Edit: 2026 May 15 - This post is archived. Mob is alive!! Main docs: mob v0.7.11 — Documentation A bit of explanation for the slightly c...
New
JesseHerrick
Hey, I’m Jesse and I’m the main contributor behind Dexter, a full-featured, lightning-fast Elixir LSP optimized for large codebases. It s...
New
mudasobwa
I am happy to introduce the very α version of the new programming language compiled to BEAM. Welcome Cure. It has literally three kille...
New
garrison
Hobbes is a low-level distributed database for the Elixir programming language. Hobbes provides a simple, safe, and scalable storage lay...
New
mhanberg
Hi everyone! The first release candidate for the Expert language server project is now available! We’ve published a press release detai...
New
budgie
A little off-topic, but I feel like people here have a good head on their shoulders. I used to be quite good at making software. Was luc...
New

We're in Beta

About us Mission Statement

Options

Thread Display Mode




Thread Preview

Skip Thread Previews