tooltip show after ajax request

[Thomas]

hey guys
I'm facing the following issue right now:

we use a grid which has a custom toolbar button which runs some function in the background. the code looks like this:

$("#CategorizeNow").click(function categorizing (e) {
        e.preventDefault();

        $.ajax({
            url: '@Url.Action("RunAutoCategorization", "Pattern")',
            beforeSend: function() {
                $("#CategorizeNow").addClass("k-state-disabled").html("Categorizing!");
            },
            success: function () {

                $("#CategorizeNow").removeClass("k-state-disabled").html("Finished");
                $("#CategorizeNow").kendoTooltip({
                    content: "successfully finished",
                    position: "top",
                    animation: {
                        close: {
                            effects: "fade:out"
                        },
                        open: {
                            effects: "fade:in",
                            duration: 1000
                        }
                    }
                }).show($("#CategorizeNow"));



            }

        });
    });

what we want to achieve is: after the categorize button is clicked it should be disabled first. when the background operation succeeded, the tooltip should be displayed at the top of the categorize now button and the button should get its original state again and be enabled again.

right now the tooltip is only showing if the operation has finished and the mouse enters the button.

any advice would be helpful.

thx in advance and kind regards
thomas

[Alexander Popov]

Hi Thomas,

Basically the $(selector).kendoTooltip({}) returns the HTML element(s) matching the selector, wrapped in a jQuery object. That object also happens to have a show method and that is what is called. In order to show the Tooltip, you should get its instance first, for example: 

$("#CategorizeNow").kendoTooltip({
    content: "successfully finished",
    position: "top",
    animation: {
        close: {
            effects: "fade:out"
        },
        open: {
            effects: "fade:in",
            duration: 1000
        }
    }
}).data("kendoTooltip").show($("#CategorizeNow"));

Regards,
Alexander Popov
Telerik