Home › Forums › General Questions › Verge3d doesn’t recognize dynamically created HTML elements ID’s.
Tagged: dynamically, Html, id
- This topic has 3 replies, 2 voices, and was last updated 8 months, 1 week ago by kdv.
-
AuthorPosts
-
2024-03-03 at 4:54 pm #71291alekstoimenovCustomer
Hello all !
I am working on a project of a virtually explorable 3D model of a house in which the user can zoom to rooms by clicking on them, and then click on individual objects to display some text.
Since the project should also be accessible to people that are not very versed in newer technologies, I got asked to create a “mega menu” that allows to navigate through the information in a more “classical” way.
To avoid redundant code, since there will be 100eds of items displayed in the mega menu, I decided to use “set prop Inner HTML to” to dynamically update the contents of the mega menu.
While doing so, I realized that the ID’s of newly create HMTL elements are not recognized by Verge3d anymore, thus my code breaks. From what I understand, it is a Document Object Model timing issue, but I can’t really find a way around this.
If anybody has an idea of how to make this work, let me know! I have attached some images to show the principle of the app + “mega menu”.
PS: I know that one workaround would be to already create the html elements with proper ID’s in the doc, but was wondering if it could all be done dynamically.
Attachments:
You must be logged in to view attached files.2024-03-03 at 5:05 pm #71295kdvParticipantEvery time you re-create an HTML element with the same ID it looses its event listeners. I suppose you code doesn’t re-add event listeners to every newly created element.
Puzzles and JS coding. Fast and expensive.
If you don’t see the meaning in something it primarily means that you just don’t see it but not the absence of the meaning at all.
2024-03-03 at 5:40 pm #71297alekstoimenovCustomerHey, thank you for the quick answer, how could you go about doing this?
Here I have a simplified version of some code attached.
Click an object -> change HTML and replaces it with new ID’s -> click on the newly created ID -> translate pop up.
Although here it doesnt work since it doesnt recognize the nezly created HTML element ID
- This reply was modified 8 months, 1 week ago by alekstoimenov.
- This reply was modified 8 months, 1 week ago by alekstoimenov.
Attachments:
You must be logged in to view attached files.2024-03-03 at 7:20 pm #71302kdvParticipantHere I have a simplified version of some code attached.
The second puzzle does nothing. It tries to register an event listener for an element with ID that doesn’n exist yet and fails. It’s a big mistake to think that the “on event of” puzzle is a monitoring puzzle. It just registers an event listener once the app is loaded and does nothing afterwards.
Puzzles and JS coding. Fast and expensive.
If you don’t see the meaning in something it primarily means that you just don’t see it but not the absence of the meaning at all.
-
AuthorPosts
- You must be logged in to reply to this topic.