Welcome Guest Search | Active Topics | Sign In | Register

NavigationItem Tooltip character limit Options
Ben Switzer
Posted: Thursday, March 1, 2012 8:06:27 AM
Rank: Advanced Member
Groups: Member

Joined: 5/30/2007
Posts: 30
I am using the tooltip feature of the Treeview. However there seems to be a limit on the amount of characters that the tooltip will display. This limit is around 500. I'm not sure if this is a limitation of the control or the browser. Is there anyway around this? I'm currently looking into building a custom tooltip if that is my only option.

Thanks

Ben
eo_support
Posted: Thursday, March 1, 2012 9:40:09 AM
Rank: Administration
Groups: Administration

Joined: 5/27/2007
Posts: 24,194
Hi,

No. The tooltip is supported by the browser through an element's "title" attribute; it's not implemented by us.

Thanks!
Ben Switzer
Posted: Thursday, March 1, 2012 9:57:25 AM
Rank: Advanced Member
Groups: Member

Joined: 5/30/2007
Posts: 30
I had a feeling. I went ahead and coded my own implentation just in case. Here is the basic code.
ASPX
<script language="javascript" type="text/javascript">
function showToolTip(e, text) {

// Get the height
var offsetHeight = parseInt(e.offsetY);
// Get the width
var offsetWidth = parseInt(e.offsetX);

var div = document.getElementById('Tooltip');
div.style.position = 'absolute';

// Set the div top to the height
div.style.top = parseInt(offsetHeight) + parseInt('10');

// Set the div Left to the height
div.style.left = parseInt(offsetWidth) + parseInt('10');

// Show the div layer
div.style.display = 'block';

// Set its Text to your desired text
if (text.length == 0) {
text = "No Description Available";
}

div.innerText = text;

div.style.height = (text.length /4)
}
function hideToolTip() {
var div = document.getElementById('Tooltip');
div.style.display = 'none';
}
</script>
<div id="Tooltip" style='DISPLAY:none;WIDTH:350px;HEIGHT:200px;padding: 5px; margin: 10px; z-index: 100;background: #f0f0f0; border: 1px dotted #c0c0c0;'></div>

Add a custom item to your treenode
<CustomItem>
<asp:Label ID="lblItem" runat="server" Text='<%#Eval("Text")%>'/>
</CustomItem>

Code Behind
Protected Sub TreeView1_ItemDataBound(ByVal sender As Object, ByVal e As EO.Web.NavigationItemEventArgs) Handles TreeView1.ItemDataBound

If (Not IsNothing(e.TreeNode.CustomItemInstance)) Then
Dim dLbl As Label = e.TreeNode.CustomItemInstance.FindControl("lblItem")
'Get the text from the db
dLbl.Attributes.Add("onMouseOver", "showToolTip(event, '" & Text & "');")
dLbl.Attributes.Add("onMouseOut", "hideToolTip();")
End If
End Sub

Hope that helps someone in the future.

Thanks,
Ben
eo_support
Posted: Thursday, March 1, 2012 10:02:47 AM
Rank: Administration
Groups: Administration

Joined: 5/27/2007
Posts: 24,194
Great. Thanks for sharing.


You cannot post new topics in this forum.
You cannot reply to topics in this forum.
You cannot delete your posts in this forum.
You cannot edit your posts in this forum.
You cannot create polls in this forum.
You cannot vote in polls in this forum.