When I’m trying to add script to Elementor via "HTML Edit" element from Elementor, or in any field of Elementor when edit it’s HTML, addEventListener doesn’t work out of admin. So if you load edited page as admin, it’s work, if you join as a guest sends error: "Uncaught TypeError: Cannot read properties of undefined (reading ‘addEventListener’)". All elements are available, tried everything, doesn’t work. Any options to add script?
function count() {
let percent = Math.round(Number(document.querySelectorAll(".form-control")[2].value)/100*35+Number(document.querySelectorAll(".form-control")[2].value));
document.querySelectorAll(".form-control")[3].value = percent ;
document.querySelectorAll(".form-control")[4].value = Math.round(percent*1.35);
}
document.querySelectorAll(".form-control")[2].addEventListener("input", count);
2
Answers
How to wait until an element exists? + On admin panel there's an extra input, so I've got wrong values when not as admin and searched with querySelectorAll
I had a similar problem I fixed mine by adding
document.addEventListener("DOMContentLoaded", () => { // your code });
before my entire javascript code,
found my solution here:
https://forum.freecodecamp.org/t/uncaught-typeerror-cannot-read-properties-of-null-reading-addeventlistener/500603