PyView JS commands support is a work in progress.
See the Phoenix LiveView JS docs for an idea of what's coming.
JS Commands let you update the DOM without making a trip to the server.
JS Commands let you update the DOM without making a trip to the server.
JS Commands let you update the DOM without making a trip to the server.
Dispatch lets you send custom javascript events on the client, which you can listen to
using window.addEventListener
.
This example sends a "copy-to-clipboard" event when the button is clicked.
It also demonstrates how to chain multiple JS commands together - this example adds a class to the button when the copy-to-clipboard event is dispatched.
[["dispatch", {"to": "#copy-text", "event": "copy-to-clipboard"}]]
Push lets you push a new event to your view, similar to phx-click
.
This example increments a counter when the button is clicked.
This can be useful if you want to chain the push event with other JS commands, like a transition. This example
uses the js.transition
command to add a bounce animation to the counter when it is incremented.
Counter | 0
Focus lets you focus an element on the page.
The first button uses js.focus("#email")
to focus the email input.
The second button uses js.focus_first("#focus-form")
to focus the first input in the form.