Question
vishnu institue of technology
vishnu institue of technology
IN
vishnu institue of technology
Posted: May 15, 2025
Last activity: May 19, 2025
Last activity: 19 May 2025 5:02 EDT
Solved
HTML in sections
Hi Guys,
A custom chart component (not provided by Pega) needs to be embedded using HTML and JavaScript in a section.
How would I add and manage the JavaScript code in the section, and how can I ensure it works without conflicting with Pega's DOM?
Regards,
Vannemsetti.
***Edited by Moderator Marije to change type from General to Product, added Product details and Capability tags****
Accepted Solution
Posted: 9 months ago
Updated: 9 months ago
Updated: 19 May 2025 5:02 EDT
Eclantiqx
Eclantiqx
IN
Hi @VANNEMSETTIV
To embed a custom chart component using HTML and JavaScript in a Pega section without conflicting with Pega's DOM, use a non-auto-generated section or HTML fragment to add a unique
<div>container for the chart, and create a separate JavaScript file as a Static Content Bundle or Text File to manage your logic. Include the script using<pega:include script="yourScript.js" />and ensure the chart is rendered only after the DOM is ready by usingpega.u.d.attachOnload()or a similar approach. Wrap your code in an IIFE or custom namespace to avoid polluting the global scope, use unique IDs or classes for your elements, and retrieve data through Pega Data Pages, hidden fields, or APIs as needed. Finally, test your implementation across dynamic contexts like modals or tabs to ensure stability.Thanks,
Hema