search

Home  >  Q&A  >  body text

Highcahrts links and buttons in tooltips not working

I'm trying to trigger a click event from inside a tooltip. I put a button with click event in it but it doesn't work. I also tried adding external links inside the tooltip. It doesn't work either. I am able to get the style of the element but not the click event that was fired.

This is the tooltip configuration

tooltip: {
    useHTML: true,
    style: {
      pointerEvents: 'auto'
    },
    formatter: function(e) {
        return '<div>'+this.x + ': ' + this.y +'<br><a href="www.google.com">Click Me</a><br><button onclick="clicked()" >Hello</button></div>'
    }
}

Here's what I've tried so far: http://jsfiddle.net/kolliparavamsikrishna/eytroh53/

P粉418854048P粉418854048228 days ago1480

reply all(1)I'll reply

  • P粉439804514

    P粉4398045142024-04-05 20:39:57

    For security reasons, Highcharts filters all HTML added via the chart options structure by default. The onclick attribute is potentially risky and is therefore filtered.

    To be able to use the onclick attribute, add it to the allowedAttributes table:

    Highcharts.AST.allowedAttributes.push('onclick');

    Live demonstration: http://jsfiddle.net/BlackLabel/om32w81g/

    Documentation: https://www.highcharts. com/docs/chart-concepts/security

    API Reference: https:// api.highcharts.com/class-reference/Highcharts.AST#.allowedAttributes

    reply
    0
  • Cancelreply