I have a JavaScript application that dynamically appends the DOM in code with HTML that includes Calcite radio buttons.
There is a target container in the DOM:
document.getElementById("my-html-container");
I want to hydrate the container with HTML that exists as a string in the code (theHTML):
<calcite-radio-button-group name="Options" id="my_options" layout="vertical">
<calcite-label layout="inline">
<calcite-radio-button value="trees"></calcite-radio-button>
Trees
</calcite-label>
<calcite-label layout="inline">
<calcite-radio-button value="shrubs"></calcite-radio-button>
Shrubs
</calcite-label>
<calcite-label layout="inline">
<calcite-radio-button value="flowers"></calcite-radio-button>
Flowers
</calcite-label>
<calcite-label layout="inline">
<calcite-radio-button value="groundcover"></calcite-radio-button>
Groundcover
</calcite-label>
<calcite-label layout="inline">
<calcite-radio-button value="bushes"></calcite-radio-button>
Bushes
</calcite-label>
</calcite-radio-button-group>
In Javascript:
document.getElementById("power360-jxdm-container").innerHTML = theHTML;
HOWEVER: the following gets thrown to the console when the above line executes:
The DOM gets hydrated successfully and the radio buttons are fully operational.
I would like to get rid of this error, which is apparently buried in ArcGIS code. What can I do?
TIA
Hello! can you help us reproduce this error? I tried to replicate but i'm not seeing it: