event kalendar light addeventlistener errors as item not in DOM

PHP, CSS und JavaScript lernen. Anwendungen für Webseiten
isb
Mitglied (Level 1)
Mitglied (Level 1)
Beiträge: 6
Registriert: Fr 21. Apr 2023, 08:25

event kalendar light addeventlistener errors as item not in DOM

Ungelesener Beitrag von isb »

I have javascript,js loading deferred and it seems like event listeneres are failing to add as items are NOT in the DOM

e.g,
document.querySelector("#monatMinus").addEventListener("click", () => {
monat--;
zeigeKalender(jahr, monat);
});


error as its not in DOM and eventlistener cant add to null

javascript.js:54 Uncaught (in promise) TypeError: Cannot read properties of null (reading 'addEventListener')
at javascript.js:54:44

(

Any ideas why?

Thanks
Ivan
Benutzeravatar
Tommy Herrmann
Site Admin
Site Admin
Beiträge: 5744
Registriert: So 6. Dez 2020, 07:37
Wohnort: Berlin
Kontaktdaten:

Re: event kalendar light addeventlistener errors as item not in DOM

Ungelesener Beitrag von Tommy Herrmann »

Hi Ivan,

unfortunately, I know very little about JavaScript.

Is that a calendar from "Werner-Zenk.de"? Please post a link to Werners page.

I have all his calender scripts working on my pages ...

... maybe this one:

https://www.mobirise-tutorials.com/Even ... er-SQLite/

I don't have the very latest version of this calendar installed, but a version from August 2022

I will try to reach Werner.
isb
Mitglied (Level 1)
Mitglied (Level 1)
Beiträge: 6
Registriert: Fr 21. Apr 2023, 08:25

Re: event kalendar light addeventlistener errors as item not in DOM

Ungelesener Beitrag von isb »

Thanks Tommy, I downloaded from
https://werner-zenk.de/archiv/event-kalender_sqlite.php


I grabbed the <section> for kalender div from your site l;)

Using Mobirise 5.8.6


Perhaps the latest version is buggy?

Do you have an older version I could try?
If it works I'll reach out to Werner on his pages

Thanks again
Ivan
Benutzeravatar
Tommy Herrmann
Site Admin
Site Admin
Beiträge: 5744
Registriert: So 6. Dez 2020, 07:37
Wohnort: Berlin
Kontaktdaten:

Re: event kalendar light addeventlistener errors as item not in DOM

Ungelesener Beitrag von Tommy Herrmann »

Normally, Werner always checks everything very conscientiously. Maybe you should wait and see if Werner gets in touch today. I'm sure he has an idea.

Werner's demo version also runs correctly:

https://werner-zenk.de/archiv/scripts/_ ... e/demo.htm

My version has one less database field "gruppe" (group of events) - you could download it here - but I would advise you to wait for Werner's answer first:

#22 - 2022-08-09-event-kalender_sqlite.zip

https://www.mobirise-tutorials.com/Download-Archiv/
Benutzeravatar
Werner-Zenk.de
Mitglied (Level 10)
Mitglied (Level 10)
Beiträge: 755
Registriert: Di 8. Dez 2020, 19:42
Wohnort: Bamberg
Kontaktdaten:

Re: event kalendar light addeventlistener errors as item not in DOM

Ungelesener Beitrag von Werner-Zenk.de »

Hi,
a new database file must be created.
This file is no longer compatible, as Tommy already wrote, the database field "group" (column) was added.
The easiest way is to delete the "database.db" file or to move it to another directory if there are important entries in it.
Then call up the calendar (via the browser) and a new database file will be created automatically.

If that doesn't work, a link to the website to investigate the issue would be helpful.
isb
Mitglied (Level 1)
Mitglied (Level 1)
Beiträge: 6
Registriert: Fr 21. Apr 2023, 08:25

Re: event kalendar light addeventlistener errors as item not in DOM

Ungelesener Beitrag von isb »

Thanks to you both. Appreciate the response. I'll try later today (I'm in California) - and provide feedback

Enjoy rest of your weekend!

Ivan
isb
Mitglied (Level 1)
Mitglied (Level 1)
Beiträge: 6
Registriert: Fr 21. Apr 2023, 08:25

Re: event kalendar light addeventlistener errors as item not in DOM

Ungelesener Beitrag von isb »

Hello. Didn't make any progress.

Sorry.

The demo.htm can be called from https://liberation.scot/calendar/demo.htm

Browser Inspect still sees a Listener add error on Month

I did delete the DB first and it didn't create a new one, because it's after the Listerner event exception.


Thanks
Ivan


php -version
PHP 8.1.2-1ubuntu2.11 (cli) (built: Feb 22 2023 22:56:18) (NTS)

dpkg --list|grep -i apache2
ii apache2 2.4.52-1ubuntu4.4 arm64 Apache HTTP Server
Benutzeravatar
Werner-Zenk.de
Mitglied (Level 10)
Mitglied (Level 10)
Beiträge: 755
Registriert: Di 8. Dez 2020, 19:42
Wohnort: Bamberg
Kontaktdaten:

Re: event kalendar light addeventlistener errors as item not in DOM

Ungelesener Beitrag von Werner-Zenk.de »

This is a PHP problem, since the calendar cannot be displayed due to a PHP error, the JavaScript cannot either
access it. "Cannot read properties of null (reading 'addEventListener') at javascript.js:54:44" happens to be the first JS function where the error occurs.

In order to activate the PHP error messages, in the file: "kalender.php" the line with:
error_reporting($_SERVER["SERVER_NAME"] == 'localhost' ? E_ALL : 0);
be changed to:
error_reporting($_SERVER["SERVER_NAME"] == 'localhost' ? E_ALL : E_ALL);

The PHP error is then displayed directly in the browser window or in the browser console (developer tools, in response to the request).

:!: There is currently no "database.db" on the server (Apparently this is not created automatically!) - https://liberation.scot/calendar/db/database.db
This can also be copied from the zip archive and placed in the "db" directory on the server.
isb
Mitglied (Level 1)
Mitglied (Level 1)
Beiträge: 6
Registriert: Fr 21. Apr 2023, 08:25

Re: event kalendar light addeventlistener errors as item not in DOM

Ungelesener Beitrag von isb »

SO EMBARRASSING


apt-get install php8.1-sqlite3



I was missing the PDO for SQL lite...



!

It works!!!


Thanks Werner (and Tommy)

Ivan




Last question :) is there a simple to force a load via google translate automatically. for my elderly customers :)
Benutzeravatar
Tommy Herrmann
Site Admin
Site Admin
Beiträge: 5744
Registriert: So 6. Dez 2020, 07:37
Wohnort: Berlin
Kontaktdaten:

Re: event kalendar light addeventlistener errors as item not in DOM

Ungelesener Beitrag von Tommy Herrmann »

Hi,

great that it works now :tu:

Working Calendar.jpg



I don't know of any way to automatically activate "Google Translate". How should Google know what language the user speaks?

Incidentally, you can also enter an URL directly in "Google Translate" > button "Websites", so that the entire page is then automatically translated:

https://translate.google.com/

Google-Translate.jpg



The link generated by Google can later be used also as an URL:

Code: Alles auswählen

https://www-mobirise--tutorials-com.translate.goog/?_x_tr_sl=auto&_x_tr_tl=en&_x_tr_hl=de&_x_tr_pto=wapp
https://www-mobirise--tutorials-com.tra ... r_pto=wapp


Google-Translated Website.jpg


I have just added such a "Translate" button to my home page at the bottom of the footer:

https://www.mobirise-tutorials.com/#content11-b

All of the following pages will then also be translated...

You can have every page translated automatically like this - for example this forum with all its posts:

https://www-mobirise--tutorials-com.tra ... r_pto=wapp



The "Google Translator" translates nowadays very well, but I put a lot of effort into optimizing my German pages which have an additional translate button - so that the translation from Google will be understandable. Sometimes you have to choose slightly different words in your language or a different sentence order so that the translation is optimized.

However, Google still has problems with formatted text, such as bold or links to other pages. Quite often the sentence order is then generated completely incorrectly.
Antworten

Wer ist online?

Mitglieder in diesem Forum: 0 Mitglieder und 16 Gäste