taro
What is :target option for JS.push?
JS.push has this :target option without much explanation. I tried what it gives to server-side but nothing comes. I thought it might change target property on JS side, but I cannot figure out how does it work. What is it for?
Most Liked
Marcus
mcrumm
Phoenix Core Team
JS.push() events go client --> server and you handle them in LiveView.handle_event/3 or LiveComponent.handle_event/3. You use the :target option to pick where the event is sent. You can target specifically a LiveComponent or you can target any DOM node with a query selector.
For instance in a LiveComponent, you might have something like the following:
<button phx-click={JS.push("clicked", target: @myself)}>click me!</button>
but you could also have for instance an id selector:
<button phx-click={JS.push("clicked", target: "#my-element")}>click me!</button>
In the second case the event will go to the LiveView containing an element #my-element.
Hope that helps!
1
Popular in Discussions
Hello everyone,
I know we had quite some threads (read through lots of them) about background job processing but it remains a hotly deba...
New
A big advantage to Elixir is all the distributed goodness but for many applications running on multiple nodes having integrated Etcd, Zoo...
New
It seems that the more I read, the more I find Elixir users speaking about all the ways that Elixir is not good for x, y, and z use cases...
New
Hi all,
I am trying to convince my team to use liveview over the current react. What are some of the points where one should consider us...
New
If a newbie asked you about Phoenix Contexts, how would you explain the basics to them?
Feel free to be as concise or in-depth as you li...
New
I’ve been hearing much about the new formatter and it’s something I have been keen to try.
I find examples buy far the most illuminating...
New
Following https://github.com/tbrand/which_is_the_fastest |>
https://raw.githubusercontent.com/tbrand/which_is_the_fastest/master/imgs...
New
There’s a new TIOBE index report that came out that shows Elixir is still not in the top 50 used languages.
It also goes on to call Elix...
New
What configs will make sense to put to runtime.exs?
–
A bit of how I configure apps:
I have generic configs in config/config.exs,
dev...
New
Looking at the stacks that existing large companies have used, WhatsApp internally uses Mnesia to store the messages, while Discord uses ...
New
Other popular topics
lets say i have a sample like
a = 20; b = 10;
if (a > b) do
{:ok, "a"}
end
if (a < b) do
{:ok, b}
end
if (a == b) do
{:ok, "equa...
New
I wanted to check elixir version in phoenix because i found that my elixir is 1.5 but when i use Enum.chunk_by it said the function is un...
New
Forgive me if this is obvious, but how does one delete a database record WITHOUT selecting it first? Ecto.Repo — Ecto v3.14.0 has exampl...
New
Please see the new poll here: Which code editor or IDE do you use? (Poll) (2022 Edition)
It’s been a while since we first asked this, I...
New
I tried installing
elixir 1.11.2
erlang 23.3.4
via asdf in my zsh shell. Enabled the versions locally and globally.
When I list them ...
New
In the code below, if the create action is not set to accept “extra_key” as an input, it errors out with a message shown above. Is there ...
New
Hello everyone,
Long time lurker first time poster here. I’ve recently begun working on Elixir full-time again! :raised_hands: It’s been...
New
I would like to know what is the best IDE for elixir development?
New
Hello!
Sorry for this astonishing simple question, but I’m really stuck. I try to set up the intellij-elixir plugin, but I don’t know ho...
New
I have an umbrella app.
Some of the apps inside depend on other apps in the umbrella, unsurprisingly.
I’m writing a test for one of the...
New
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
- #forms
- #api
- #metaprogramming
- #security
- #hex









