数据回发时，维护ASP.NET Tree控件位置 (2)

来源：中国设计秀作者：点击：81 加入收藏发表评论

0

顶一下

为了具体说明做法，我使用TreeView编写了一些代码，在Page_Load时间里加载一段脚本来找到需要的单元格（参考下表），在＜body＞的onload时间里调用该函数.

Imports System.Collections.Generic

Partial Class _Default
Inherits System.Web.UI.Page

Protected Sub Page_Load(ByVal sender As Object, _
ByVal e As System.EventArgs) Handles Me.Load

InjectLoadEvent()

If (IsPostBack) Then Return

TreeView1.Nodes.Clear()

Dim chicken As New TreeNode("Chicken")
　TreeView1.Nodes.Add(chicken)
　Dim beef As New TreeNode("Beef")
　TreeView1.Nodes.Add(beef)
　Dim pork As New TreeNode("Pork")
　TreeView1.Nodes.Add(pork)
　Dim fish As New TreeNode("Fish")
　TreeView1.Nodes.Add(fish)

　chicken.ChildNodes.Add(New TreeNode("Crepes Florentine with Buffalo Chicken"))
　fish.ChildNodes.Add(New TreeNode("Linguine with White Clam Sauce"))
　pork.ChildNodes.Add(New TreeNode("Pork Loin with Peanut and Madarin Orange Sauce"))
　beef.ChildNodes.Add(New TreeNode("Standing Rib Roast with Fennel and Blue Cheese Potatoes"))

　' We need a bunch of stuff here so we will add some stubs
　Dim I As Integer
　For I = 1 To 50
　　chicken.ChildNodes.Add(New TreeNode("Placeholder " + I.ToString()))
　　fish.ChildNodes.Add(New TreeNode("Placeholder " + I.ToString()))
　　pork.ChildNodes.Add(New TreeNode("Placeholder " + I.ToString()))
　　beef.ChildNodes.Add(New TreeNode("Placeholder " + I.ToString()))
　Next

　TreeView1.CollapseAll()
End Sub

Public Sub InjectLoadEvent()
　Dim script As String = _
　　　"function LoadEvent()" + _
　　　"{{" + _
　　　" try" + _
　　　" {{" + _
　　　" var elem = document.getElementById('{0}_SelectedNode');" + _
　　　" if(elem != null )" + _
　　　" {{" + _
　　　" var node = document.getElementById(elem.value);" + _
　　　" if(node != null)" + _
　　　" {{" + _
　　　" node.scrollIntoView(true);" + _
　　　" {1}.scrollLeft = 0;" + _
　　　" }}" + _
　　" }}" + _
　" }}" + _
　" catch(oException)" + _
　" {{}}" + _
　"}}"

Page.ClientScript.RegisterClientScriptBlock(Me.GetType(), "LoadEvent", _
String.Format(script, TreeView1.ClientID, Panel1.ClientID), True)
　End Sub
End Class

　　下面的代码显示了页面的布局：

＜%@ Page Language="VB" AutoEventWireup="false" CodeFile="Default.aspx.vb" Inherits="_Default" %＞
＜!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＞Focus Tree Node on Postback＜/title＞
＜/head＞
＜body onload="LoadEvent()"＞
　＜form id="form1" runat="server"＞
　　＜div＞
　　　＜asp:Panel ID="Panel1" runat="server" Height="200px" Width="200px" ScrollBars="Both"＞
　　　　＜asp:TreeView ID="TreeView1" runat="server"＞
　　　　　＜SelectedNodeStyle BackColor="#8080FF" /＞
　　　　＜/asp:TreeView＞
　　　＜/asp:Panel＞
　　＜/div＞
　＜/form＞
＜/body＞
＜/html＞

下图显示了本例子运行的结果

　　最后，下面的代码显示了javascript的注入方式：

＜script＞
function LoadEvent()
{
　try
　{
　　var elem = document.getElementById('TreeView1_SelectedNode');
　　if(elem != null )
　　{
　　　var node = document.getElementById(elem.value);
　　　if(node != null)
　　　{
　　　　node.scrollIntoView(true);
　　　　Panel1.scrollLeft = 0;
　　　}
　　}
　}
　catch(oException)
　{}
}// --＞
＜/script＞

　　用Javascript定义的LoadEvent函数将查找隐藏字段,我们利用TreeView控件的ClientID 查找所有元素,不过,在嵌套多个TreeView控件后,名称将变得非常长.找到单元格的值后,我使用scrollIntoView方法.scrollLeft属性将让滚动条滚动当前位置.

[1] [2]

2007-10-04 11:29:00 出处：天极网

本文引用地址：http://www.cnwebshow.com/edu/html/article_4007.html

热点文章/相关文章

素材下载　矢量潮流素材背景素材模板