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

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
AstonJ
Just done a fresh install of macOS Big Sur and on installing Erlang I am getting: asdf install erlang 23.1.2 Configure failed. checking ...
New
ohm
Does anybody have good learning resources with regards to going into Event Driven Design, Architecture or Sourcing? I got recommended Er...
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
conradwt
Hi, I’m building an application that will have support for both the web and mobile. At this time, I’m using PhxGenAuth for authenticatio...
New
sona11
I wrote this code to calculate Fibonacci numbers by specifying the size. The results are correct, however the one thing that concerns me ...
New
pillaiindu
Currently reading the book “Programming Phoenix LiveView”. At the end of the Chapter 1, I’m trying to solve the guess game. If the user ...
New
Fl4m3Ph03n1x
Background I have an umbrella project, where I run mix test from the root. In one of the apps, I am mocking the File module using the Mo...
New
jaeyson
Hi! I have clarifications (please correct me, as I mostly mix/confuse this details) with the following: The term RAG here where it read...
New
Fl4m3Ph03n1x
Background As I often do, I read books to learn and improve myself. I also enjoy teaching and helping others when I can, so this is somet...
New

Other popular topics Top

PragmaticBookshelf
Stop developing web apps with yesterday’s tools. Today, developers are increasingly adopting Clojure as a web-development platform. See f...
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
siddhant3030
I’m thinking of buying a monitor that I can rotate to use as a vertical monitor? Also, I want to know if someone is using it for program...
New
AstonJ
Do the test and post your score :nerd_face: :keyboard: If possible, please add info such as the keyboard you’re using, the layout (Qw...
New
PragmaticBookshelf
Use WebRTC to build web applications that stream media and data in real time directly from one user to another, all in the browser. ...
New
AstonJ
Saw this on TikTok of all places! :lol: Anyone heard of them before? Lite:
New
Maartz
Hi folks, I don’t know if I saw this here but, here’s a new programming language, called Roc Reminds me a bit of Elm and thus Haskell. ...
New
AnfaengerAlex
Hello, I’m a beginner in Android development and I’m facing an issue with my project setup. In my build.gradle.kts file, I have the foll...
New
NewsBot
Node.js v22.14.0 has been released. Link: Release 2025-02-11, Version 22.14.0 'Jod' (LTS), @aduh95 · nodejs/node · GitHub
New
PragmaticBookshelf
A concise guide to MySQL 9 database administration, covering fundamental concepts, techniques, and best practices. Neil Smyth MySQL...
New