Questions & Help>Questions

Javascript hook expects handle_event in all live views

/phoenix#javascript#event#liveview
peter-de-boer

peter-de-boer

I have implemented a Javascript hook for calculating the screen width and height as I need that info in one of my live views. I have basically used some code from this topic: https://forum.elixirforum.com/t/liveview-sending-more-data-than-expected/36259. So I have an event listener which pushes an event whenever the window is resized. This is handled by an appropriate handle_event in the liveivew that needs it.

The problem is that my application contains more than one liveview. Now when I navigate to a different live view, I get an error message like ** (FunctionClauseError) no function clause matching in BwWeb.StoreLive.handle_event/3.

So, am I supposed to implement an handle_event for this javascript event in every live view in my application, i.e. also in the ones that do not need that info? Or is there a more clever way to solve this?

2 comments
/phoenix#javascript#event#liveview
1383 2

Showing Posts 1 to 2

alexl

alexl

I’ve the same error, do you resolved it ?

1
Post #1
mcrumm

mcrumm

Phoenix Core Team

You can use server lifecycle hooks to attach a shared handle_event on each LiveView. You can use the on_mount macro or the :on_mount option on the live_session router macro to reduce even more duplication:

#router.ex

live_session :default, on_mount: [MyAppWeb.SharedEvents] do
  # routes...
end

# shared_events.ex

defmodule MyAppWeb.SharedEvents to
  @moduledoc "Event handlers shared on all LiveView modules"
  use Phoenix.Component

  def on_mount(:default, _params, _session, socket) do
    socket = attach_hook(socket, :resize, :handle_event, &handle_event/3)
    {:cont, socket}
  end

  def handle_event("resize", _params, socket) do
    # handle the resize
    {:cont, socket}
  end
end
6
Post #2
— All posts loaded —

Where Next? Top

View thread on forum (has 2 replies!)
phoenix
javascript
event
liveview
Home Questions & Help>Questions
8 1296 2
Last post
REPLY VIEW THREAD WITH 2 POSTS

Trending in Questions Top

RSP87
Questions & Help>Questions

Programming Phoenix chat example - iPhone lack of socket updates
I’m working on a project that simulates the bumbl example in the programming phoenix book. It acts almost like an email client. We have a...
/phoenix#troubleshooting
1 950 6
New
nseaSeb
Questions & Help>Questions

What's the approach for handling lists that allows for optimized traversal?
Hello, I know there is an approach for handling lists that allows for optimized traversal, but I can’t recall the specific method (somet...
#learning-elixir#list
13 419 15
New
kpanic
Questions & Help>Questions

"Mentoring" match maker? maybe MVP
Hi everyone, I am toying with the idea of building a “match maker” for giving personal help to people that wants to start coding. I sta...
#helpers#programming
8 940 4
New
brecabral
Questions & Help>Questions

Scoped Routes section of the Phoenix guides refers to a problem without explaining what it is ("but there is a problem")
Documentation While reading the Scoped Routes section, I noticed that the documentation currently refers to a problem without explainin...
/phoenix
6 829 4
New
velrest
Questions & Help>Questions

`:erlang.float` vs `value * 1.0`: Which is the prefered way?
So my question is quite simple and i have found no conclusive answer on forum, google or AI. Should we use :erlang.float for Integer to ...
#learning-elixir
12 638 5
New
asweet-confluent
Questions & Help>Questions

Why is Logger's default level :debug?
I recently noticed that Elixir’s Logger defaults its primary log level to :debug when no :logger, :level application configuration is pre...
#logging#logger
13 504 10
New
apz
Questions & Help>Questions

Vscode elixirLS setup - want to fix/understand "couldn't create connection to server"
I’m new to elixir and just tried to install the elixirLS extension for VScode(ium) and it is throwing some errors that I would like help ...
#learning-elixir#vscode#elixir-ls
0 144 3
New

Other Trending Topics Top

GenericJam
News>Announcing

Mob - Native BEAM / Elixir on Native Mobile
Edit: 2026 May 15 - This post is archived. Mob is alive!! Main docs: mob v0.7.11 — Documentation A bit of explanation for the slightly c...
/mob#library#beam#mobile#liveview#react-native#mobile-app#mobile-development
257 8039 108
New
JesseHerrick
News>Announcing

Dexter - A fast, full-featured Elixir LSP optimized for large codebases
Hey, I’m Jesse and I’m the main contributor behind Dexter, a full-featured, lightning-fast Elixir LSP optimized for large codebases. It s...
#library#lsp#dexter
187 6988 64
New
mudasobwa
Chat & Discussions>Discussions

Cure - a new language compiled to BEAM
I am happy to introduce the very α version of the new programming language compiled to BEAM. Welcome Cure. It has literally three kille...
#static-types#type-checking#types#fsm
171 6315 70
New
marciok
News>Announcing

Gust - A task orchestration system built in Elixir
Hi there! We created Gust: A task orchestrator inspired by Airflow. For those who have never heard about Aiflow, it’s a Python-based wor...
/phoenix/oban#library#workflow#background_job#reactor
111 4469 40
New
mhanberg
Chat & Discussions>Discussions

Expert LSP is now available!
Hi everyone! The first release candidate for the Expert language server project is now available! We’ve published a press release detai...
#lsp#expert
220 4348 38
New
jimsynz
News>Announcing

Beam Bots - Resilient Robotics on the BEAM
Beam Bots (or just BB for short) is a framework for building fault-tolerant robotics applications in Elixir using familiar OTP patterns. ...
/beam-bots#library#robotics#bb
119 2916 28
New
Back to top

Latest Phoenix Threads

Phoenix Forum ❯

Questions & Help>Questions

Questions Questions ❯

Latest on Elixir Forum

Elixir Forum ❯

Sponsor Spotlight

Dashbit

Build Elixir applications with speed and confidence.

Our Sponsors

Dashbit

Build Elixir applications with speed and confidence.

EEF

Supporting innovation across the BEAM ecosystem.

Coders51

We build reliable cloud platforms for business-critical systems.

AppSignal

Catch errors, track performance, monitor hosts and more.

Code Sync

Elixir, Erlang & BEAM conferences from Code Sync - join us in 2026!

Pragmatic Bookshelf

Practical resources that improve the lives of professional developers.

Manning

Master modern tools, write cleaner code, and tackle real-world challenges.

ElixirCasts

Producing high quality Elixir screencasts since 2017.

Software Mansion

The team behind Membrane, Popcorn, LiveDebugger. Available for hire.

Pragmatic Studio

Courses that'll move you from confusion to "Aha, now I get it!"

View all our sponsors ❯

Categories:

Sub Categories:

Forums

Popular Tags

Our Sponsors

Dashbit

Build Elixir applications with speed and confidence.

EEF

Supporting innovation across the BEAM ecosystem.

Coders51

We build reliable cloud platforms for business-critical systems.

AppSignal

Catch errors, track performance, monitor hosts and more.

Code Sync

Elixir, Erlang & BEAM conferences from Code Sync - join us in 2026!

Pragmatic Bookshelf

Practical resources that improve the lives of professional developers.

Manning

Master modern tools, write cleaner code, and tackle real-world challenges.

ElixirCasts

Producing high quality Elixir screencasts since 2017.

Software Mansion

The team behind Membrane, Popcorn, LiveDebugger. Available for hire.

Pragmatic Studio

Courses that'll move you from confusion to "Aha, now I get it!"

View all our sponsors ❯

We're in Beta

About us Mission Statement

Options

Thread Display Mode




Thread Preview

Skip Thread Previews