Categories
CMS Joomla Mastering Development

Parsing unique xml node and associating them with the HTML element of the same name

I have a complicated form where the user can set up a lot of things. When done, all data will be written to an xml file.
This xml file is read by another html file (in which only html and javascript works), which interprets and fills the HTML elements with the scanned data.

Below is an example xml snippet, which can be different in that the pre-name of the CUSTOM node changes, which can be e.g. firstCustomText, secondCustomText, thirdCustomText, etc … (here is the CustomText is permanent)

But it is also possible that there is no customText, then in turn the defaultText would replace it. Same with other unique xml values ​​…
The unique node includes a unique name part and a permanent name part, what is e.g. FIRST + CustomText or THIRD + CustomUrl.

I tried with a loop by creating an array/object with unique names, and function, but I got stuck here.

I would like your help in reading the existing individual elements from the xml file below and associating them with the HTML element of the same name.

To make things a little clearer, it will be an interactive map with parts active (e.g. if you have some information to add, such as a url or text), then you can click on the area, but it can also have a custom or default color for some parts. Complicated, I know …

The PHP version is already written and works perfectly, but I want one that doesn’t have PHP, because anyone who might embed it in their own website but doesn’t have the ability to run PHP can’t use it.

Thank you in advance for the answers and solutions!

Contents of the xml file: (example, part)

<defaultColor>red</defaultColor>
<defaultText>Some Text</defaultText>
<defaultUrl>defaultlink.com</defaultUrl>
<firstCustomColor>yellow</firstCustomColor>
<secondCustomColor>green</secondCustomColor>
<firstCustomText>Custom Text 1</firstCustomText>
<secondCustomText>Custom Text 2</secondCustomText>
<firstCustomUrl>linkone.com</firstCustomUrl>
<secondCustomUrl>linktwo.com</secondCustomUrl>

Leave a Reply

Your email address will not be published. Required fields are marked *