mrmurphy

mrmurphy

How exactly does phx-update detect changes?

I’ve run into a situation where I’ve got a list of posts inside of a container that uses phx-update=“prepend”, and the posts on the socket are temporary assigns. Inside of the “for” comprehension, I want to render data not only from the post, but from another assign on the socket.

When the post changes, my DOM updates render, but when the other assign I’m using (pending_loves, in the image) changes, I don’t get any DOM updates. I’m guessing this is because live view is doing some magic change tracking around the for comprehension specifically? What’s the most idiomatic way to inform Live View that I want the content inside of the for to update when a different assign changes as well?

Most Liked

mrmurphy

mrmurphy

Thanks! Victor Mono:

dimitarvp

dimitarvp

Thank you! Instant switch in my terminal programs. Can’t believe I missed it even though I have it in my library.

Previously used InconsolataGo but Victor Mono is definitely better. :slight_smile:

mrmurphy

mrmurphy

I thought maybe if I included the pending_loves assign on the right-hand side of the for comprehension, the change would be picked up and re-rendered. But no dice:

  <div id="posts" class="max-w-lg mx-auto dark:bg-gray-800" phx-update="prepend">
    <%= for {post, pending_loves} <- (@posts|>Enum.map(&({&1, get_pending_loves(@pending_loves, &1.id)}))) do %>
    <div id="<%= post.id %>">

Even with this change, when I update the assign @pending_loves, the count of pending loves does not update on the page inside of the for comprehension until the post object is updated. It does update if placed outside of the comprehension, though, even inside of the phx-update="prepend" container.

Where Next?

Popular Backend topics Top

New
DevotionGeo
I know that -t flag is used along with -i flag for getting an interactive shell. But I cannot digest what the man page for docker run com...
New
Jsdr3398
Are there any databases that require no setup (can be shipped in a small zip together with the project)?
New
New
sampu
I have a use case where a client is invoking a Rest endpoint via a load balancer, which in turn invokes a third party endpoint which is r...
New
JimmyCarterSon
Hello, I am. very new to Elixir lang I have only been doing it for about 2 weeks. I recently started following this tutorial todo list, ...
New
JimmyCarterSon
I am following this tutorial . I have followed carefully correcting errors as I go. The app allows you to create a blog post and add comm...
New
Fl4m3Ph03n1x
Background I am moving towards defined data structures in my application, and I find that TypedStruct is quite useful. Questions Howeve...
New
Fl4m3Ph03n1x
Background I have a phoenix application in Windows 11. Unfortunately for me, I cannot compile the application because of a dependency err...
New
apoorv-2204
Anyone know how to get in golang? I am from elixir background?.
New

Other popular topics Top

AstonJ
A thread that every forum needs! Simply post a link to a track on YouTube (or SoundCloud or Vimeo amongst others!) on a separate line an...
New
PragmaticBookshelf
Brace yourself for a fun challenge: build a photorealistic 3D renderer from scratch! In just a couple of weeks, build a ray tracer that r...
New
PragmaticBookshelf
Learn from the award-winning programming series that inspired the Elixir language, and go on a step-by-step journey through the most impo...
New
DevotionGeo
I know that -t flag is used along with -i flag for getting an interactive shell. But I cannot digest what the man page for docker run com...
New
New
AstonJ
Saw this on TikTok of all places! :lol: Anyone heard of them before? Lite:
New
AstonJ
We’ve talked about his book briefly here but it is quickly becoming obsolete - so he’s decided to create a series of 7 podcasts, the firs...
New
PragmaticBookshelf
Build efficient applications that exploit the unique benefits of a pure functional language, learning from an engineer who uses Haskell t...
New
First poster: bot
zig/http.zig at 7cf2cbb33ef34c1d211135f56d30fe23b6cacd42 · ziglang/zig. General-purpose programming language and toolchain for maintaini...
New
AstonJ
If you’re getting errors like this: psql: error: connection to server on socket “/tmp/.s.PGSQL.5432” failed: No such file or directory ...
New