Prima.Modal.JS (Prima v0.3.0)
View SourceJavaScript commands for client-side modal control.
Summary
Functions
Closes the currently open modal.
Opens a modal with the given ID.
Opens a modal with the given ID, chaining with existing JS commands.
Functions
Closes the currently open modal.
This function dispatches a JavaScript event to close any open modal. It can be used from buttons, form submissions, or other user interactions.
Example
<.button phx-click={Prima.Modal.JS.close()}>
Close
</.button>
# Chain with other JS commands
<.button phx-click={Prima.Modal.JS.close() |> JS.push("modal-closed")}>
Close and Notify
</.button>
Opens a modal with the given ID.
This function dispatches a JavaScript event to show the modal. The modal must already be rendered in the DOM with the corresponding ID.
Parameters
id- The ID of the modal to open (string)
Example
<.button phx-click={Prima.Modal.JS.open("my-modal")}>
Open Modal
</.button>
Opens a modal with the given ID, chaining with existing JS commands.
This function allows you to chain modal opening with other JavaScript commands, enabling complex interactions like navigation combined with modal display.
Parameters
js- APhoenix.LiveView.JSstruct containing previous commandsid- The ID of the modal to open (string)
Example
# Chain with navigation
<.button phx-click={JS.patch("/modal/history") |> Prima.Modal.JS.open("my-modal")}>
Navigate and Open Modal
</.button>
# Chain with custom events
<.button phx-click={JS.push("track") |> Prima.Modal.JS.open("my-modal")}>
Track and Open
</.button>