If we have TreeView inside of the div with the fixed width and height we want selected node to be visible after postback.
Here is small JavaScript function that does this (you don’t have to use jQuery as I did to get the result):
1: function ScrollToSelectedNode()
2: {
3: //* get selected node id
4: //* 'tvwScrollTo' - is our tree view id
5: var selectedNodeID = $('#<%=tvwScrollTo.ClientID %>_SelectedNode').val();
6:
7: if (selectedNodeID != '')
8: {
9: //* calculate selected top an left position (http://docs.jquery.com/CSS/position)
10: //* in order to get correct relative position remember to set div position to absolute
11: var scrollTop = $('#' + selectedNodeID).position().top;
12: var scrollLeft = $('#' + selectedNodeID).position().left;
13:
14: //* here 'divTreeViewScrollTo' is the id of the div where we put our tree view
15: $('#divTreeViewScrollTo').scrollTop(scrollTop);
16: $('#divTreeViewScrollTo').scrollLeft(scrollLeft);
17: }
18: }
Run this function on postback:
1: protected void tvwScrollTo_SelectedNodeChanged(object sender, EventArgs e)
2: {
3: ScriptManager.RegisterStartupScript(Page, Page.GetType(), "ScrollToSelectedNode", "ScrollToSelectedNode();", true);
4: }
Result before node selected and after:
