Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
195
Scroll into View
posted

I have a WDT with a bunch of items in it.  So many, that it has a scrollbar (I've set the height of the WDT to 300px).

If I select one of the nodes from code-behind.  How can I get that node in the tree selected and scrolled into view? 

I've figured out the selection part, but the user has to scroll the tree to see the highlighted/selected node.

- Jerome

 

 

 

  • 19693
    Suggested Answer
    posted

    Hello Jerome,

    There is scrollIntoView javascript function

    http://news.infragistics.com/forums/p/41411/230834.aspx#230834

    In order to take advantage of it I recommend you handling Initialize client event.

    On the server side you can select the desired item and check in the Initialize event if there are selected items.

       function WebDataTree1_Initialize(sender, eventArgs) {

                ///<summary>

                ///

                ///</summary>

                ///<param name="sender" type="Infragistics.Web.UI.ControlMain"></param>

                ///<param name="eventArgs" type="Infragistics.Web.UI.EventArgs"></param>

     

                //Add code to handle your event here.

     

                var tree = $find('WebDataTree1');

     

                if (tree.get_selectedNodes()[0] != null)

                    tree.get_selectedNodes()[0].get_element().scrollIntoView();

            }

     

           <ig:WebDataTree ID="WebDataTree1" runat="server" Height="100px" Width="200px" DataSourceID="XmlDataSource1"

                SelectionType="Single" InitialDataBindDepth="3" InitialExpandDepth="3" OnUnload="WebDataTree1_Unload">

                <ClientEvents Initialize="WebDataTree1_Initialize" />

                <DataBindings>

                    <ig:DataTreeNodeBinding DataMember="Customer" TextField="CustomerName" ValueField="CustomerID"

                        Depth="1" />

                    <ig:DataTreeNodeBinding DataMember="Order" TextField="OrderID" ValueField="OrderID"

                        Depth="2" />

                    <ig:DataTreeNodeBinding DataMember="OrderDetail" TextField="ProductName" ValueField="ProductID"

                        Depth="3" />

                </DataBindings>

            </ig:WebDataTree>

     

    protected void Button1_Click(object sender, EventArgs e)

            {

                WebDataTree1.ClearSelection();

                WebDataTree1.Nodes[0].Nodes[2].Nodes[0].Selected = true;

                WebDataTree1.ActiveNode = WebDataTree1.Nodes[0].Nodes[2].Nodes[0];          

            }

     

    Please let me know if you have other questions.