CODEWITHSUNDEEP
kendo-ui
BaconJuice
BaconJuice

Reputation: 3769

KendoUI unable to run .kendoTooltip on each calendar day after month change occurs

I have a simple KendoUI calendar widget implemented with a custom class on each day, which on click is suppose to show a kendoUI ToolTip 

                $("#calendar").kendoCalendar({
                    month: {
                        // template for dates in month view
                        content: '<div class="tool_tip">#=data.value#</div>'
                    },
                    footer: false
                });


                $(".tool_tip").kendoTooltip({
                    autoHide: false,
                    showOn: "click",
                    position: "top",
                    content: 'Hello'
                });

For some odd reason it will only show the tooltip on click of each day for the current month. If I were to change the month the tooltip will no longer show. Also note that the class "tooltip" is injected to all other days in the month as well.

Thank you for reading.

Upvotes: 0

Views: 668

Answers (1)

OnaBai
OnaBai

Reputation: 40887

The problem is with the way that you set the tooltip. Since this is initialized when the Calendar is created but not refreshed when you navigate. Elements created after navigating do not have the tooltip associated to it.

You should do:

    $(document).ready(function () {
        $("#calendar").kendoCalendar({
            month: {
                // template for dates in month view
                content: '<div class="tool_tip">#=data.value#</div>'
            },
            footer: false,
            navigate : function () {
                $(".tool_tip").kendoTooltip({
                    autoHide: false,
                    showOn: "click",
                    position: "top",
                    content: 'Hello'
                });
            }
        });
    });

Check it running here: http://jsfiddle.net/OnaBai/kvbse/

Upvotes: 1

Related Questions