Bind chart tooltips to tap event

[Ron]

Hi,

 

We have a bar chart with tooltips, very similar to the one in your demo of http://demos.telerik.com/kendo-ui/bar-charts/index

Our tooltips are using a template which include <a> element. The <a> element has onclick attribute which allow the user to drill down according to selection and move to a new view using app.navigate

It all looks good and works well in Chrome browser. But when we run it on iPhone device the tooltip on which we click remains also in the new view. Following your suggestion in other post we work on changing all onclick events to tap events and we hope this will also solve the remaining tooltip problem. However we cannot find a way of attaching tap event to the tooltip <a> elements:

- We tried adding data-role="touch" with data-tap to the tooltip template but this does not work, most probably because the <a> element is rendered after kendo attached handlers

- We also looked for a way to programatically bind all those <a> elemets to kendo tap event, but we could not find what chart event we should use as we need an event in which the tooltips already exist

 

Can you please advise how we can attach tap event to the chart tooltip?
On the otherhand, if you suggest us to keep the onclick tooltip implementation - is there anything you can suggest us to make sure the tooltip disappears after we change to the other view?

Thanks,

Ron.

[T. Tsonev]

Hi,

I assume this is a duplicate of this thread. Let me know if this is not correct.

Regards,
T. Tsonev
Telerik

 

 

[Ron]

Hi T. Tsonev,

This is incorrect - those are two different issues. Please advise us as soon as you can about this one. It is not clear from the documentation how a tap event can be added via kendo template (either to a chart or to a list view)/ All the details appear in the first thread.

Thanks,

Ron,

[Daniel]

Hello Ron,

The chart API does not currently provide an event that can be used to bind the tap handler to the element but it should be possible to use a delegated handler:

$("body").kendoTouch({
    filter: ".k-chart-tooltip a",
    tap: function(e) {
        ...
    }
});

However, I am not sure if this will resolve the problem. If the tooltip remains opened then this indicates that none of the events used to hide the tooltip are triggered which will probably also occur when using the tap event. If the problem persists then currently the only option that I can suggest is to use the internal _tooltip hide method:

var chart = $("#chart").getKendoChart();
chart._tooltip.hide();

Regards,
Daniel
Telerik