tooltip content loaded dynamically

[Morten]

To a listview with pictures, I attach a tooltip to every picutre and want to ajax load the tool tip content.

ToolTip:

var tooltip = $("#lvPictures").kendoTooltip({
    filter: "img.imgInfo",
    width: 120,
    position: "top",
    autoHide: false,
    content: function (e) {
        var target = e.target;
        var fileId = target.data('identity');
        return helpers.GetPictureToopTip(fileId);
    }
}).data("kendoTooltip");

The helper function:

var helpers =

{

    GetPictureToopTip: function (fileId) {

        helpers.GetFile(fileId).done(function (json) {

            var jsonObj = JSON.parse(json.d);

            var html = '';

            html += '<div>Picture info</div>'

            html += '<div>' + jsonObj.FileName + '</div>'

            return html;

        });

    }

}

Ajax call is fired just fine and returns data, however, the tool tip is show without content.

What am I doing wrong?

[Dimo]

Hello Morten,

The GetPictureToopTip function is not returning any value. The "return html" statement is within an asynchronous closure, so it has no effect in the main function scope. I suggest you to review how the following demo is implemented and do something similar:

http://dimov/kendo/web/tooltip/ajax.html

Otherwise you will need to populate the tooltip directly and manually inside the done() event callback.

Greetings,
Dimo
the Telerik team

[Morten]

Hi Dimo
thanks for your reply.
The demo-page you refer to does not exist.
Are you refering to http://demos.kendoui.com/web/tooltip/ajax.html ?
/Morten

[Dimo]

Hi Morten,

I sent you a link to my local PC by mistake, sorry about that. You got it right, this is the demo I was referring to.

Regards,
Dimo
the Telerik team