Fileexplorer tooltip

[Neepa]

I'm trying to add a tooltip for my custom column - here is the code:

void Grid_ItemDataBound(object sender, GridItemEventArgs e)         
{
    foreach (GridColumn column in RadFileExplorer1.Grid.MasterTableView.RenderColumns)                 
    {                     
        if ((column is GridTemplateColumn) && (column.HeaderText.Equals("Document Title")))                     
        {                         
            if (e.Item is GridDataItem)                         
            {                             
                GridDataItem gridItem = e.Item as GridDataItem;                             
                string text = gridItem[column.UniqueName].Text;  
                
                //this line will show a tooltip                             
                gridItem[column.UniqueName].ToolTip = text;                         
            }                                              
        }                 
    }             
}


I'm unable to get the value of the cell as tooltip - can you please help?

[Vessy]

Hello Neepa,

The desired tooltip functionality cannot be achieved on the Server, because the data-binding of the FileExplorer's Grid is made on the Client, and so the column values have been still not available in the Grid's ItemDataBound event.

A similar functionality could be achieved on the Client with the help of the RadToolTipManager, but the tooltip should be added to the whole row, not only to the hovered cell. If this approach is acceptable for you, you can use both the RadTooltipManager and the RadTooltip to achieve the desired tooltip functionality. In order to display custom information into the tooltip, you need to assign handler to the RowMouseOver client-side event of the Grid component of the RadFileExplorer.

If the tooltip's value, which you want to display, requires any AJAX requests the recommended control is RadTooltipManager (otherwise you could use the RadToolTip due to performance reasons).

<telerik:RadToolTipManager ID="RadToolTipManager1" runat="server" Height="50px" RelativeTo="Mouse"
    EnableShadow="true">
</telerik:RadToolTipManager>

<telerik:RadFileExplorer ID="RadFileExplorer1" runat="server" OnClientLoad="OnClientLoad">
    <Configuration ViewPaths="~/ROOT" DeletePaths="~/ROOT" UploadPaths="~/ROOT" />
</telerik:RadFileExplorer>

<script type="text/javascript">
    function OnClientLoad(explorer, args) {
        var grid = explorer.get_grid();
        grid.add_rowMouseOver(ToolTipManager_OnRowMouseOver);
    }

    function ToolTipManager_OnRowMouseOver(sender, args) {
        var dataItem = args.get_gridDataItem();
        var rowElem = dataItem.get_element();
        var tooltipManager = $find("<%= RadToolTipManager1.ClientID %>");

        if (!tooltipManager) return;

        var tooltip = tooltipManager.getToolTipByElement(rowElem);
        if (!tooltip) {
            tooltip = tooltipManager.createToolTip(rowElem);
            tooltip.set_text(dataItem.get_dataItem().Name + " is hovered.");
        }
        setTimeout(function () {
            tooltip.show();
        }, 20);
    }
</script>

You could find more details about the above mentioned controls in the following help article: RadToolTip Client Object and live demo: RadToolTipManager Client-side API

Regards,
Veselina Raykova
Telerik

[Dominik]

Hello,

In url from last reply is error. URL contains:  http://admin.telerik.com/ToolTip%20/%20RadToolTipManager%20Client-side%20API

I have question: How exclude from tooltip one column with Button generated in modified ResolveDirectory ? Added with this code:

string htmlText = string.Format("<input type='button' value='{0}' onclick='onClickHandler(this);' />", "Opis pliku");
fileItem.Attributes.Add("Opis", htmlText);

Regards,
Dominik

[Vessy]

Hi Dominik,

Thank you for your feedback - I have updated the pointed link so it would no mislead the other users.

regarding your question - I have already answered your support ticket on the subject, but for convenience will paste my answer here as well:
I am afraid that currently this functionality cannot be achieved with the FileExplorer control. The reason for that is the Grid nested in it does not have full implementation, so you do not have access to all the needed functionality.

Regards,
Veselina Raykova
Telerik