Changing text with a JavaScript action in a nanoflow

0
Hi all,   I'm playing around with JavaScript in mendix as a nanoflow.    The idea is to replace the text "Text will go here" with whatever I write in the JS file.         Currently my simple JavaScript is as follows (although I have tried several other things):   // BEGIN USER CODE const NewText= document.getElementsByClassName("mx-text mx-name-text3"); NewText.innerHTML = "Boop <b>boop</b>!"; // END USER CODE   At some point I also tried to just create a new element underneath that text element, using     NewText.insertAdjacentElement("afterend", "<p>boop boop underneath</p>");    however the console in mendix complained that insertAdjacentElement "is not a function", which I don't understand, since I believe it is a standard function.   Does anybody have any suggestions, or ideas about what I'm doing wrong?   Thanks
asked
1 answers
1

Hi Andres,

I guess the issue is that getElementsByClassName is returning a list of results (note the s after Element). So you should update it to update all occurrences (or the first or something different). Also, insertAdjacentElement expects an Element, not a string.

Try something like this:

// BEGIN USER CODE

const NewText = document.getElementsByClassName("mx-text mx-name-text3");

Array.from(NewText).forEach(element => {
 element.innerHTML = "Boop <b>boop</b>!";

 const newParagraph = document.createElement("p");
 newParagraph.innerHTML = "boop boop underneath";
 element.insertAdjacentElement("afterend", newParagraph);
});

// END USER CODE

Good luck!

Johan

answered