Expand my Community achievements bar.

Target activity with <svg> tag or runtime content

Avatar

Level 3

Hi All,

 

We are trying to create activity changing text related with <svg> tag but it's breaking the functionality of it.

it looks like to me that it's kind of runtime thing and changes to it breaks the communication of existing code.

 

rudraWiley_0-1740411716208.png

 

Is there any work around for this?

Topics

Topics help categorize Community content and increase your ability to discover relevant content.

1 Reply

Avatar

Level 1

Hi @rudraWiley

As per your screen shot, you are trying to change to change the SVG attribute which contents tooltip HTML content correct ?

This can be achieved through below script on form based approach.

<script>
// Get the popover element
var updatePopover = $('.icon-info[data-bs-toggle="popover"]');

// Update the popover customized content and title
updatePopover.attr('data-bs-content',
'Customized text content ');
updatePopover.attr('data-bs-title',
'Customized text content');

// Update the popover using Bootstrap's API
var popoverInstance = new bootstrap.Popover(updatePopover[0]);
popoverInstance.update();

var popoverTriggerList = [].slice.call(
document.querySelectorAll('[data-bs-toggle="popover"]'))
var popoverList = popoverTriggerList
.map(function (popoverTriggerEl) {
return new bootstrap.Popover(popoverTriggerEl)
})
</script>

Hope this helps !