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

Invalid Viewstate with Dynamic Tooltips on RadTreeView Nodes

1 Answer 59 Views
ToolTip
This is a migrated thread and some comments may be shown as answers.
Adriaan
Top achievements
Rank 1
Adriaan asked on 05 Jun 2015, 07:24 PM

I am having an issue with using a RadTooltipManager on RadTreeView nodes here is related code - this sits inside a user control:

<asp:HiddenField runat="server" id ="ResourceToolTip"/>
                        <telerik:RadToolTipManager
                            ID="RadTooltipManager1"
                            runat="server"
                            AutoTooltipify="False"
                            Position="TopCenter"
                            EnableViewState="False"
                            OnAjaxUpdate="RadTooltipManager1_AjaxUpdate">
                        </telerik:RadToolTipManager>
                        <telerik:RadTreeView
                            runat="server"
                            ID="tvResourceKitBundles"
                            OnClientContextMenuShowing="onClientResourceTreeContextMenuShowing"
                            OnClientContextMenuItemClicking="onClientResourceTreeContextMenuItemClicking"
                            OnClientMouseOver="onNodeMouseOverResourceTree"
                            OnClientMouseOut="onNodeMouseOut"
                            OnClientNodeDragStart="onResourceKitDragStart"
                            OnClientNodeDropping="onNodeDropping"
                            OnContextMenuItemClick="tvResourceKitBundles_ContextMenuItemClick"
                            OnNodeEdit="tvResourceKitBundles_NodeEdit"
                            OnNodeDrop="tvResourceKitBundles_OnNodeDrop"
                            EnableDragAndDrop="True"
                            EnableDragAndDropBetweenNodes="true">
                            <ContextMenus>
                                <telerik:RadTreeViewContextMenu ID="tvResourceKitContextMenu" runat="server">
                                    <Items>
                                        <telerik:RadMenuItem Value="Rename" Text="Rename"></telerik:RadMenuItem>
                                        <telerik:RadMenuItem Value="Edit" Text="Edit"></telerik:RadMenuItem>
                                        <telerik:RadMenuItem Value="Delete" Text="Delete"></telerik:RadMenuItem>
                                        <telerik:RadMenuItem Value="Add Hyperlink" Text="Add Hyperlink"></telerik:RadMenuItem>
                                        <telerik:RadMenuItem Value="Alphabetize Resources" Text="Alphabetize Resources"></telerik:RadMenuItem>
                                        <telerik:RadMenuItem Value="Featured" Text="Make Final Output" Visible="False"></telerik:RadMenuItem>
                                    </Items>
                                </telerik:RadTreeViewContextMenu>
                            </ContextMenus>
                        </telerik:RadTreeView> 

function onNodeMouseOverResourceTree(sender, args) {
            //gets the node upon mousing over the node
            currentNode = args.get_node();
            currentTree = "resourceTree";

            if (currentNode.get_level() == 1) {
                $get("<%=ResourceToolTip.ClientID%>").value = currentNode.get_value();
                showToolTip(sender._element);
            }
        }

        function showToolTip(element) {
            var tooltipManager = $find("<%=RadTooltipManager1.ClientID%>");
            //If the user hovers the image before the page has loaded, there is no manager created  
            if (!tooltipManager) return;
            //Find the tooltip for this element if it has been created   
            var tooltip = tooltipManager.getToolTipByElement(element);
            //Create a tooltip if no tooltip exists for such element  
            if (!tooltip) {
                tooltip = tooltipManager.createToolTip(element);
            }
            tooltip.show();
        }

 

 Code behind:

 //this gets called on page load

            foreach (var resource in resources)
            {
                //build new node
                var node = new RadTreeNode(resource.Title, resource.ResourceID.ToString());
                node.ImageUrl = "/ImageResize.aspx?img=" + resource.FileIcon + "&h=16&w=16";
                node.Attributes.Add("ResourceFileID", resource.ResourceFileID.ToString());
                node.Attributes["id"] = Guid.NewGuid().ToString();

                RadTooltipManager1.TargetControls.Add(node.Attributes["id"], node.Value, true);

                if (resource.IsFeatured)
                {
                    node.BackColor = ColorTranslator.FromHtml("#EE7026");
                }
                else
                {
                    node.BackColor = Color.White;
                }

                //add new node tree
                nodes.Add(node);

 

//and this is the ajax update

 

protected void RadTooltipManager1_AjaxUpdate(object sender, ToolTipUpdateEventArgs e)
        {
            try
            {
                var resource = new Resource(SQLData.GetDBInt(ResourceToolTip.Value));

                Label lbl = new Label();
                lbl.ID = "lblResourceToolTip";
                if (resource.ResourceFileID > 0)
                    lbl.Text = resource.ResourceFile.FileName;
                else
                {
                    lbl.Text = Path.GetFileName(resource.URLToFile);
                }

                e.UpdatePanel.ContentTemplateContainer.Controls.Add(lbl);
            }
            catch
            {
            }
        }

 

 

So everything mostly works however when I quickly hover over a list of nodes it will start firing invalid viewstate errors - though it seems generally to continue to work - any way "I can avoid these viewstate errors? I'm thinking it's just firing too many ajax postbacks too fast when you run your mouse over multiple nodes at once - I've considered switching to the web service method for doing this but figured I'd see if there was a simple solution. Also, I don't necessarily need this to be dynamic but when I tried to use the tooltipify set to true and load each node.tooltip value on page load it does not work for me. Thanks

1 Answer, 1 is accepted

Sort by
0
Adriaan
Top achievements
Rank 1
answered on 05 Jun 2015, 11:29 PM
Seems I may have solve my own problem, after examining the code for multiple demos out there for this I realized I did not need to use the javascript function that generated a tooltip with the tooltipmanager when I was already assigning target controls on page load. No onmouseover event or hidden field needed for this as it must be generated when you assign the target controls.
Tags
ToolTip
Asked by
Adriaan
Top achievements
Rank 1
Answers by
Adriaan
Top achievements
Rank 1
Share this question
or