注册 登录  
 加关注
   显示下一条  |  关闭
温馨提示!由于新浪微博认证机制调整,您的新浪微博帐号绑定已过期,请重新绑定!立即重新绑定新浪微博》  |  关闭

海宏软件的个人主页

用机器解放人的双手

 
 
 

日志

 
 

海宏原创:updatePanel里的treeView,postBack后位置  

2008-04-26 22:15:18|  分类: 默认分类 |  标签: |举报 |字号 订阅

  下载LOFTER 我的照片书  |

海宏原创:updatePanel里的treeView,postBack后位置,已经发表在微软的forums.asp.net。

[updatepanel , treeView , position , state , postBack , hiddenfiled]

put a treeView in a panel, it will show a scrollBar; when click then treeView, it will postBack,how to restore the position?

------------------------------------------------------------------------------------------------------------------------

1:in common asp page: aspx

<script language="javaScript">

 function loadEvent()
        {
            //tree在postBack时,显示在页面中的位置会移动,注册客户端脚本处理。加在body onload="loadEvent()"
            try
            {   //hf_SelectedNode tv_Main_SelectedNode 自动生成的hiddenField
                var s="";   //tv_Main_Data.selectedNodeID.value;        //自动生成的java Object
                if (s=="" || s==null) s="tv_Main_SelectedNode";
                var elem = document.getElementById(s);          //tv_Main_SelectedNode
                if(elem != null )
                {
                    var node = document.getElementById(elem.value);
                    if(node != null)
                    {
                        node.scrollIntoView(false);             // true:页面顶部
                        //document.getElementById('div_Tree').scrollLeft = 0;
                    }
                }
            }
            catch(oException)
            {}
        }

</script>

.....

<body onload="loadEvent()" >

 ...

<asp:Panel ID="panel_Tree" runat="server" ScrollBars="Both" Style="width:100%; height:100%"
                            <asp:TreeView ID="tv_Main"  runat="server" OnSelectedNodeChanged="tv_Main_SelectedNodeChanged" Width="300px">
                                <Nodes>
                                    <asp:TreeNode Text="新建节点" Value="新建节点11"></asp:TreeNode>
                                    <asp:TreeNode Text="新建节点" Value="新建节点12"></asp:TreeNode>
                              </nodes>

                           </asp:treeView>

</asp:panel>

------------------------------------------------------------------------------------------------------------------------

2:in ajax-updatePanel is hard, my way is record in client-cookie(thanks eric), aspx:

</script language="javaScript">

function loadEventCookie()
        {
            var strCook = document.cookie;
            document.title=strCook;
            if(strCook.indexOf("!~")!=0){
                var intS = strCook.indexOf("!~");
                var intE = strCook.indexOf("~!");
                var strPos = strCook.substring(intS+2,intE);
                document.getElementById("panel_Tree").scrollTop = strPos;
            }
        }
        function setDivPosition()
        {
            var intY = document.getElementById("panel_Tree").scrollTop;
            document.title = intY;
            document.cookie = "yPos=!~" + intY + "~!";
        }
    </script>

.........

<asp:Panel ID="panel_Tree" runat="server" ScrollBars="Both" Style="width:100%; height:100%"
                                onscroll="setDivPosition()" onmouseup="loadEventCookie()" onmouseover="loadEventCookie()" >
                            <asp:TreeView ID="tv_Main"  runat="server" OnSelectedNodeChanged="tv_Main_SelectedNodeChanged" Width="300px">
                                <Nodes>
                                    <asp:TreeNode Text="新建节点" Value="新建节点11"></asp:TreeNode>
                                    <asp:TreeNode Text="新建节点" Value="新建节点12"></asp:TreeNode>
                                    <asp:TreeNode Text="新建节点" Value="213"></asp:TreeNode>

                                </Nodes>
                                <SelectedNodeStyle BackColor="LimeGreen"/>
                            </asp:TreeView>
                        </asp:Panel>

 

it works good! haha! 


下边的办法没实验过,从http://forums.asp.net/p/1076981/2322691.aspx#2322691贴来的:

---------------------------------------------------------------------

<asp:UpdatePanel ID="updateGrid" runat="server" UpdateMode="Conditional">
    <ContentTemplate>
        <input type="hidden" id="hdnScrollTop" runat="server" value="0" />
        <div id="divScroll" style="width:350px;height:200px; overflow-x:hidden; overflow-y:scroll;" onscroll="$get('hdnScrollTop').value = this.scrollTop;">
            <asp:gridview id="grdOrders" runat="server" width="95%" datasourceid="objDataSource" cellpadding="3" GridLines
="Horizontal">
                <Columns
>
                    <asp:CommandField ShowSelectButton="True"
/>
                </Columns
>
            </asp:gridview>
  
        
</div
>
    </ContentTemplate
>
</
asp:UpdatePanel>

<asp:ScriptManager ID="scriptManager" runat="server" EnablePartialRendering="True" />
<
script type="text/javascript" language
="javascript">
    var prm = Sys.WebForms.PageRequestManager.getInstance();
    prm.add_pageLoaded(pageLoaded);
    prm.add_beginRequest(beginRequest);
   
var postbackElement;

    function beginRequest(sender, args) {
        postbackElement = args.get_postBackElement();
    }

    
function
pageLoaded(sender, args) {
        
var
updatedPanels = args.get_panelsUpdated();
        
if (typeof(postbackElement) == "undefined"
) {
            
return
;
        }
        
if (postbackElement.id.toLowerCase().indexOf('grdorders'
) > -1) {
            $get("divScroll").scrollTop = $get("hdnScrollTop").value;

        }
     }
</script>




  评论这张
 
阅读(1320)| 评论(3)
推荐 转载

历史上的今天

在LOFTER的更多文章

评论

<#--最新日志,群博日志--> <#--推荐日志--> <#--引用记录--> <#--博主推荐--> <#--随机阅读--> <#--首页推荐--> <#--历史上的今天--> <#--被推荐日志--> <#--上一篇,下一篇--> <#-- 热度 --> <#-- 网易新闻广告 --> <#--右边模块结构--> <#--评论模块结构--> <#--引用模块结构--> <#--博主发起的投票-->
 
 
 
 
 
 
 
 
 
 
 
 
 
 

页脚

网易公司版权所有 ©1997-2017