otuv
Access function in app.js
Hi,
I try to do a rather simple js interaction but fail.
In my html (index.html.eex) I got
<button onclick="doClick()">Click me!<button>
and in my app.js I got the corresponding function
function doClick() { console.log('did it') }
But I get
ReferenceError: doClick is not defined
Do I explicitly make it available somehow?
Marked As Solved
peerreynders
<button id="myBtn">Click me!<button>
// somewhere in the top level of app.js
const btn = document.getElementById('myBtn');
btn.addEventListener('click', doClick, false);
MDN: EventTarget.addEventListener
Phoenix uses a bundler (Phoenix < 1.4 ? Brunch : webpack 4). This deliberately keeps everything out of the global space so the markup can’t find that function. Meanwhile JavaScript has no problem reaching into the DOM.
Also Liked
dimitarvp
That article was legit the first useful JS post I’ve read in years. Finished it five days ago and most of what I didn’t understand was suddenly clear.
The ecosystem is still frustrating and dysfunctional – it’s JS after all – but at least it makes sense in its own way. And I now know what to reach for and when.
peerreynders
In the past 8 months I’ve spammed a link to that article 6 times (including this one).
peerreynders
Maybe put this one on your play queue: A Framework Author’s Case Against Frameworks
Popular in Questions
Other popular topics
Latest Phoenix Threads
Latest on Elixir Forum
Sponsor Spotlight
Courses that'll move you from confusion to "Aha, now I get it!"
Categories:
Sub Categories:
Forums
Our Sponsors
Build Elixir applications with speed and confidence.
Supporting innovation across the BEAM ecosystem.
We build reliable cloud platforms for business-critical systems.
Catch errors, track performance, monitor hosts and more.
Real-time error tracking, performance insights, and observability for devs.
Practical resources that improve the lives of professional developers.
Enabling companies to succeed by building software people love.
The deployment platform built for Elixir: PaaS ease, VPS control.
Courses that'll move you from confusion to "Aha, now I get it!"