silviurosu

silviurosu

I am rendering a comprehension inside Liveview template (a list of reviews).
For each one when pressing a button I want to display an inline form to reply to that message.


Some code snippets simplified to show what I have:


<article :for={rv <- @reviews} id={"received_#{rv.id}"} class="static p-6 bg-white">
  <div class="font-normal text-text_color">
    <%= rv.description %>
   </div>
 <button type="button" id={"show_reply_button_#{rv.id}"}  phx-click={JS.push("show_reply_form", value: %{id: rv.id})}>
       <img class="mr-1.5 w-3.5 h-3.5" src="/images/message.svg" alt="raporteaza icon" /> <%= gettext("Reply") %>
  </button>
<div :if={@form} class="mt-8 ml-12">
  <.simple_form for={@form} id="reply_review_form" phx-submit="submit_reply" class="mb-6">
      <:actions>
          <.input type="hidden" id="review_id" field={@form[:review_id]} />
      </:actions>
      <:actions>
          <label for="comment" class="sr-only">Your comment</label>
          <.input type="textarea" id="comment" field={@form[:content]} rows="6"  placeholder={gettext("Tell us...")} />
      </:actions>
      <:actions>
        <button type="button" phx-click="cancel_reply">
          <%= gettext("Cancel") %>
        </button>
        <button type="submit" >
          <%= gettext("Send") %>
        </button>
      </:actions>
    </.simple_form>
  </div>
</article>

On the server side I have:

def handle_event("show_reply_form", %{"id" => review_id}, socket) do
    form_data = %{
      "review_id" => review_id,
      "content" => nil
    }
    form = to_form(form_data, as: "review")
    socket = assign(socket, form: form)
    {:noreply, socket}
  end

Clicking on the button send the event to server side, The form is added to assigns but in the UI I get no diff via socket and no update is made.
I tried to generate a dynamic form for each item from the list but still no render update.

Any suggestions on what I am doing wrong?

Showing Posts 1 to 2

03juan

03juan

The form is nested inside the for comprehension so the loop won’t run again unless you make a change to @reviews. I think in the current code the same form will then render for each comment.

silviurosu

silviurosu OP

I also tried to add a form for each element from the list like this:

<div :if={assigns[:"form_#{rv.id}"} class="mt-8 ml-12">
  <.simple_form for={assigns[:"form_#{rv.id}"]} id="reply_review_form" phx-submit="submit_reply" class="mb-6">
      <:actions>
          <.input type="hidden" id="review_id" field={assigns[:"form_#{rv.id}"][:review_id]} />
      </:actions>
      <:actions>
          <label for="comment" class="sr-only">Your comment</label>
          <.input type="textarea" id="comment" field={assigns[:"form_#{rv.id}"][:content]} rows="6"  placeholder={gettext("Tell us...")} />
      </:actions>
      <:actions>
        <button type="button" phx-click="cancel_reply">
          <%= gettext("Cancel") %>
        </button>
        <button type="submit" >
          <%= gettext("Send") %>
        </button>
      </:actions>
    </.simple_form>
  </div>

and

def handle_event("show_reply_form", %{"id" => review_id}, socket) do
    form_data = %{
      "review_id" => review_id,
      "content" => nil
    }
    form = to_form(form_data, as: "review")
    socket = assign(socket, "form_#{review_id}": form)
    {:noreply, socket}
  end

Theoretically it should render just the form from the corresponding review but nothing is send to UI.

— 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
velrest
So my question is quite simple and i have found no conclusive answer on forum, google or AI. Should we use :erlang.float for Integer to ...
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
mnkhod
So i have been using ash framework for a while and i love it. However currently the issue im having with ash framework is the error handl...
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