2010-05-26 68 views
0

如何在myDropDownList_SelectedIndexChanged()事件触发时转到页面上的定位标记? 我使用常规的ASP.NET窗体。asp.net下拉列表回发到锚

更新:以下内容适用于ASP.NET按钮。当我从下拉列表中选择一个选项时,我想达到相同的功能(去#someAnchor)。

<asp:Button ID="btnSubmit" runat="server" Text="Do IT" Width="186px" PostBackUrl="#myAnchor" CausesValidation="false" /> 

更新:我会尝试进一步解释我最初没有详述的细节。 这是一个长页面,在页面中间有一个下拉列表。下拉列表下方是一个标签,该标签将根据从下拉列表中选择的项目进行更改。回发期间将发生标签更新。此时该页面需要继续关注下拉菜单。我试图使用AJAX来实现这一点,但其他实现细节阻止了它的工作。回发后转到锚标签的能力将是一个简单的解决方案。这是我想要完成的简化版本。

<%@ Page Language="VB" %> 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 

<script runat="server"> 

    Protected Sub myDropDown_SelectedIndexChanged(ByVal sender As Object, ByVal e As System.EventArgs) 
     myLabel.Text = myDropDown.SelectedValue 
     'When this finishes, go to #myAnchor 
    End Sub 
</script> 

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
    <title>Untitled Page</title> 
</head> 
<body> 
    <form id="form1" runat="server"> 
    <div> 
     Imagine many lines of text here. 
     <a name="myAnchor"></a> 
     <asp:DropDownList ID="myDropDown" runat="server" OnSelectedIndexChanged="myDropDown_SelectedIndexChanged" asdf="asdf" PostBackUrl="#myAnchor"></asp:DropDownList> 
     <asp:Label ID="myLabel" runat="server"></asp:Label> 
    </div> 
    </form> 
</body> 
</html> 
+0

你是什么意思“去一个锚标记”?跟随锚点的href? – 2010-05-26 16:25:05

+0

我编辑了这个问题来澄清我的意图。 – 2010-05-26 16:33:50

+0

我认为你真的需要对你的问题更具体。在这一点上,你的问题没有多大意义。也许你可以发布更多的代码。 – user153410 2010-05-26 16:40:25

回答

0

这是我已经实现了我想要的结果。

Protected Sub myDropDown_SelectedIndexChanged(ByVal sender As Object, ByVal e As System.EventArgs) Handles myDropDown.SelectedIndexChanged 

    Response.Redirect("Default.aspx?myDropDown=" & myDropDown.SelectedItem.Text.ToString.Trim & "#myAnchor") 

End Sub 

Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load 
    If Not IsPostBack Then 
     Dim myDropDownValue As String = Request.QueryString("myDropDown") 
     If myDropDownValue <> "" Then 

      myDropDown.Items.FindByText(myDropDownValue).Selected = True 
       Label1.Text = GetTextBasedOnDropDownSelection(myDropDownValue) 

     End If 
    End If 
End Sub 
+0

我知道这很哈克。我宁愿有一个更好的解决方案... – 2010-05-27 15:34:21

0

我会用JavaScript的 - 无论是在你的代码隐藏注册脚本,或者有一个asp:文字是SelectedIndexChanged事件后,才可见。修改location.href以附加您的锚点。

0

一种方法是使用ASP.NET中的forms.Controls bla bla bla属性。然而,我建议你使用一个asp.net超链接控件或链接按钮,这将允许你直接用它的ID访问它。

谢谢, MNK。

3

这可能做的伎俩

<asp:DropDownList ID="DropDownList1" runat="server" 
     onchange="document.location= this.value"> 
     <asp:ListItem Text="Anchor" Value="#anchor"></asp:ListItem> 
     <asp:ListItem Text="Anchor2" Value="#anchor2"></asp:ListItem> 
    </asp:DropDownList> 

你提到myDropDownList_SelectedIndexChanged()(服务器代码),但你必须这样做在客户端,除非你有一个很好的理由去服务器

+0

不幸的是,我确实需要回到服务器。 – 2010-05-26 17:24:14

0

如果你的下拉清单包含三个项目,例如说:

  • 第1页
  • 第2页
  • 第3页

给这个下拉列表的AutoPostBack="true"一个属性,然后在下拉OnSelectedIndexChanged方法写:

if (DDl.SelectedIndex == 1) { 
    Response.Redirect("~/page1"); 
} 
else if (DDl.SelectedIndex == 2) { 
    Response.Redirect("~/page2"); 
} 
0

这个要求简单的JavaScript solution.But问题是设计是有缺陷的。一旦移动到屏幕上的新区域,无法进入导航选择列表而无需滚动回来。总之类似以下作品

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default3.aspx.cs" Inherits="Default3" %> 

<!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 type="text/javascript"> 
     function Goto(x) { 
     window.location = "#"+x.value; 
     } 

    </script> 
</head> 
<body> 
    <select id="Select1" name="D1" onchange="Goto(this);"> 
     <option value="Loc1" >go to 1 </option> 
     <option value="Loc2">go to 2 </option> 
     <option value="Loc3">go to 3 </option> 
     <option value="Loc4">go to 4 </option> 
    </select><form id="form1" runat="server"> 
    </form> 


<strong> <a href="#" id="Loc1" >Location 1</a></strong> 

blah 
    <strong><a href="#" id="Loc2">Location 2</a></strong> 

    <strong><a href="#" id="Loc3">Location 3</a></strong> 

    <strong><a href="#" id="Loc4">Location 4</a></strong> 
</body> 
</html> 
1

添加此信息到您的网页加载,您将很好去。

Page.MaintainScrollPositionOnPostBack = true;