height and widthproblem for tooltip load from client side

[CH]

Dear Sir:
    I have a radgrid and there is some tooltips inside the grid. i tried to use the tooltip manager for the tooltip but i found the performance is not satisfy when there are a lot of tooltips needed. Now, i changed to load the tooptip by javascript (sample on below) . Everything seem fine except the width and height, the tooltips seem cannot automatically change the tooltips width and height, i also tried to use the auto scrollbar but the scrollbar didn't show up. how can I pass the tooltip's width and height to the tooltip manager and it will resize/show scrollbar to the tooltip. is there any sample which i can follow?

i got some hints from other post  with property (OnClientBeforeShow, OnClientShow) to change the size  but i cannot make it work.



thks

From CH

function GetXMLObject()
{
    var xmlhttp=false;

    try {
        xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
    } catch (e) {
        try
        {
            xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
        } catch (E)
        {
            xmlhttp = false;
        }
    }

    if (!xmlhttp && typeof XMLHttpRequest!='undefined') {
        try {
            xmlhttp = new XMLHttpRequest();
        } catch (e) {
            xmlhttp=false;
        }
    }

    if (!xmlhttp && window.createRequest) {
        try {
            xmlhttp = window.createRequest();
        } catch (e) {
            xmlhttp=false;
        }
    }

    if (!xmlhttp)
        return null;
    else
        return xmlhttp;
}

function ShowTooltip(sender, manager, url) {
        if (manager != null) {
            var tooltip = manager.getToolTipByElement(sender);

            if (!tooltip) {
                tooltip = manager.createToolTip(sender);
            }

            if (xmlRequest != null)
                xmlRequest.Abort();

            xmlRequest = GetXMLObject();

            tooltip.show();
            var contentElement = document.createElement('div');

            contentElement.innerHTML = "<img src='../../images/loading7.gif' />";
            tooltip.set_contentElement(contentElement);

            if (xmlRequest != null) {
                xmlRequest.open("GET", url, true);
                xmlRequest.onreadystatechange = function () {
                    if (xmlRequest.readyState == 4) {
                        if (xmlRequest.status == 200) {
                            tooltip.hide();
                            contentElement = document.createElement('div');
                            contentElement.innerHTML = xmlRequest.ResponseText;
                            if (contentElement.outerText.length < 10)
                                contentElement.style.width = "100px";


                            tooltip.set_contentElement(contentElement);
                            tooltip.show();

                        }
                    }
                }
            }
            xmlRequest.send(null);
        }

[Marin Bratanov]

Hello CH,

You can use the RadToolTip's Client-side API and its set_width() and set_height() functions to change the dimensions of a tooltip dynamically. I also believe that setting some values for the Width and Height properties of the RadToolTipManager will also help, especially in combination with ContentScrolling set to Auto.

  On a side note - if you use a single tooltip you may also use a regular RadToolTip and set its target element via its set_targetControl() function before showing it every time instead of creating many tooltips via the RadToolTipManager.


Regards,
Marin
the Telerik team

[CH]

i tried to set the widht and height for my tool tip on client event onclientshow, because my contain inside the tooltip is a separate page. how can i get the width and the height of the page contain?

[Marin Bratanov]

Hi Ch,

  The way you can get the dimensions of your page is not related to the RadControls in any way and it is up to you to determine this size. There are many browser incompatibilities and differences in determining dimensions, yet I can suggest two ways that may aid you in this endeavor:

1) The best way is to have the container of the page with some exact dimensions that are sufficient for your needs (for example style="width: 400px; height: 400px;"). If you know them you can set them as the tooltip's size easily via it client-side methods.

2) you can try using the static Telerik function getBounds() to calculate the dimensions of a given DOM element, yet I cannot guarantee that this will work correctly for an entire page loaded inside an absolutely positioned element (the tooltip).

Generally speaking autosizing and determining dimensions is a task that is the developer's responsibility, since it is the custom content that requires it.


Greetings,
Marin
the Telerik team