Welcome Guest Search | Active Topics | Sign In | Register

TreeView scroll position lost Options
Mike Wynn
Posted: Tuesday, July 20, 2010 11:56:25 AM
Rank: Advanced Member
Groups: Member

Joined: 8/24/2007
Posts: 130
Hi,

I have recently moved from version 7 to version 8. In version 7, the treeview was maintaining its scroll position on callback. I am finding in version 8 that this is no longer happening.

I noticed a post a while back that said that this was a known issue and you are working on it. Is this still the case? If so, will we get a fix any time soon?

Regards,
Phil wynn
eo_support
Posted: Tuesday, July 20, 2010 12:12:04 PM
Rank: Administration
Groups: Administration

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

We are not aware of that the issue still exists in the latest build. Can you provide a test page that demonstrates the issue?

Thanks!
Mike Wynn
Posted: Wednesday, July 21, 2010 6:35:28 AM
Rank: Advanced Member
Groups: Member

Joined: 8/24/2007
Posts: 130
Hi,

I have put together the following example to demonstrate my problem. A context menu is used to add new nodes to the tree. If you scroll down to the bottom of the tree and add a new node, the scroll position is lost on callback. If you run the same code on version 7, the scroll position is maintained.

This may seem like a contrived example, but it is causing us many problems, and we have had to roll back the upgrade as a result.

Code: HTML/ASPX
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="IIPay.Web.WebForm1" %>

<%@ Register Assembly="EO.Web" Namespace="EO.Web" TagPrefix="eo" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script>
        function ShowContextMenu(e, treeView, node) {
            var contextMenuItem = eo_GetObject('<%=contextMenu.ClientID%>').getTopGroup().getItemByIndex(0);
            contextMenuItem.setValue(node.getPath());
            
            eo_ShowContextMenu(e, "<%=contextMenu.ClientID%>");
            return true;
        }
        function ContextClicked(evt, eventInfo) {
            eo_Callback('<%=callbackPanel.ClientID%>', eventInfo.getItem().getValue());
            return true;
        }

    </script>
</head>
<body>
    <form id="form1" runat="server">
    <eo:CallbackPanel ID="callbackPanel" runat="server" Width="600" OnExecute="treePanel_Execute">
        <div style="width: 49%; height: 300px; float: left;">
            <eo:TreeView ID="bindingTree" CausesValidation="false" AllowDragDrop="false" AllowEdit="false"
                AllowMultiSelect="false" Indent="20" PathSeparator="," EnableViewState="false"
                runat="server" ControlSkinID="None" Height="100%" OnItemPopulate="bindingTree_ItemPopulate"
                ClientSideOnContextMenu="ShowContextMenu">
                <TopGroup>
                    <Nodes>
                        <eo:TreeNode Text="Root Node" ItemID="root"></eo:TreeNode>
                    </Nodes>
                </TopGroup>
                <LookNodes>
                    <eo:TreeNode ItemID="_Default" ExpandedImageUrl="00030302" CollapsedImageUrl="00030301"
                        ImageUrl="00030302" NormalStyle-CssText="PADDING:1px; COLOR:black; cursor:pointer; BACKGROUND-COLOR:transparent;"
                        SelectedStyle-CssText="PADDING:1px; COLOR:black; cursor:pointer; BACKGROUND-COLOR:#e0e0e0; font-weight:bold;">
                    </eo:TreeNode>
                </LookNodes>
            </eo:TreeView>
        </div>
    </eo:CallbackPanel>
    <eo:ContextMenu ID="contextMenu" runat="server" ClientSideOnItemClick="ContextClicked">
        <LookItems>
            <eo:MenuItem ItemID="_Default" HoverStyle-CssText="cursor:pointer; color:White; background-color:#353F7D;">
                <SubMenu ExpandEffect-Type="GlideLeftToRight" Style-CssText="font-size:8pt; padding:5px; color:White; background-color:#353F7D; "
                    CollapseEffect-Type="gliderighttoleft" OffsetX="5" OffsetY="5" ShadowDepth="4"
                    ItemSpacing="1" />
            </eo:MenuItem>
        </LookItems>
        <TopGroup>
            <Items>
                <eo:MenuItem ItemID="menuItem1" Text-Html="Add Node" />
            </Items>
        </TopGroup>
    </eo:ContextMenu>
    </form>
</body>
</html>


Code: C#
using System;
using System.Text;
using EO.Web;

namespace IIPay.Web
{
    public partial class WebForm1 : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            if (!IsPostBack)
            {
                PopulateFirstLevel();
                bindingTree.TopGroup.Nodes[0].ExpandPath();
            }
        }

        private void PopulateFirstLevel()
        {
            for (int i = 0; i < 20; i++)
            {
                TreeNode node = new TreeNode("Node #" + i);
                node.PopulateOnDemand = true;
                node.ItemID = node.Text;
                bindingTree.TopGroup.Nodes[0].ChildNodes.Add(node);
            }
        }

        protected void treePanel_Execute(object sender, CallbackEventArgs e)
        {
            TreeNode parentNode = PopulateToSpecifiedNode(e.Parameter);
            if (parentNode != null)
            {
                TreeNode node = new TreeNode(parentNode.Text + "-" + parentNode.SubGroup.Nodes.Count);
                node.ItemID = node.Text;
                parentNode.SubGroup.Nodes.Add(node);

                node.ExpandPath();
                node.Selected = true;
            }
        }

        private TreeNode PopulateToSpecifiedNode(string nodePath)
        {
            PopulateFirstLevel();
            
            TreeNode node = (TreeNode) bindingTree.FindItem(nodePath);
            if(node != null)
            {
                return node;
            }

            string[] nodeIds = nodePath.Split(new[] { ',' });
            node = (TreeNode)bindingTree.FindItem(nodeIds[0] + "," + nodeIds[1]);
            for (int index = 2; index < nodeIds.Length; index++)
            {
                TreeNode childNode = new TreeNode(nodeIds[index]);
                childNode.ItemID = childNode.Text;
                node.SubGroup.Nodes.Add(childNode);

                node = childNode;
            }
            return node;
        }

        public void bindingTree_ItemPopulate(object sender, NavigationItemEventArgs e)
        {
            //Get the parent tree node
            TreeNode treeNode = (TreeNode)e.NavigationItem;
            CreateSubNodes(treeNode);
        }

        private static void CreateSubNodes(TreeNode parentNode)
        {
            for (int i = 0; i < 10; i++)
            {
                TreeNode node = new TreeNode(parentNode.Text + "-" + i);
                node.ItemID = node.Text;
                parentNode.SubGroup.Nodes.Add(node);
            }
        }
    }
}
eo_support
Posted: Wednesday, July 21, 2010 2:41:39 PM
Rank: Administration
Groups: Administration

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

Please try to make the following change:

1. Place an eo:ScriptEvent control in the page;
2. Set that control as the CallbackPanel trigger;
3. Instead of calling eo_Callback in your script, call

Code: JavaScript
//Please replace cmd_name and cm_args with anything. These two 
//values are passed to the server side Command event
eo_TriggerServerEvent("&lt;%=ScriptEvent1.ClientID%&gt;", cmd_name, cmd_args);


You would then handle the ScriptEvent's Command event instead of the CallbackPanel's Execute event. The TreeView should work fine as soon as you go through a trigger.

Thanks!
Mike Wynn
Posted: Thursday, July 22, 2010 6:13:38 AM
Rank: Advanced Member
Groups: Member

Joined: 8/24/2007
Posts: 130
That has sorted the problem. Thank you.


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.