This is a migrated thread and some comments may be shown as answers.

tooltip show after ajax request

1 Answer 89 Views
ToolTip
This is a migrated thread and some comments may be shown as answers.
Thomas
Top achievements
Rank 2
Thomas asked on 16 Dec 2013, 10:28 AM
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

1 Answer, 1 is accepted

Sort by
0
Accepted
Alexander Popov
Telerik team
answered on 16 Dec 2013, 02:54 PM
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
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Tags
ToolTip
Asked by
Thomas
Top achievements
Rank 2
Answers by
Alexander Popov
Telerik team
Share this question
or