How can I use “this.template.queryselectorall” to manipulate the sections?

173 Asked by DylanPowell in Salesforce , Asked on Feb 19, 2024

I am currently working on a web-based application where users can create personalized profiles. Every profile has multiple sections like “about me”, “interest” and “skills”. In this particular task, I need to dynamically update the visibility of certain sections based on the interactions of the users. How can I use “ this.template.queryselectorall” for selecting and manipulating these sections when a user selects a particular option from the drop-down menu?

Answered by Dylan PEREZ

In the context of Salesforce, you can accomplish this particular objective by ensuring that each section of the user profile has a specific class or even data attribute to create differences between them. Then you can utilize “this.template.queryselectorall” to select all the elements that match that class attribute. Finally, you can use JavaScript to iterate over the selected elements and then you can modify their visibility based on the selection of the users. Here is an example given:-

HTML

Your Answer

Parent Categories