web-dev-qa-db-ja.com

ASP.netポストバック-特定の位置までスクロール

画面上部に多くのコンテンツがあるASP.net WebFormsページがあります。ページにポストバックしてページの別のセクションを表示するリンクボタンがあります。ページが更新されたら、フォーカスを設定し、ページのこのセクションまでスクロールダウンします。

やってみた

txtField.Focus()

私のコードビハインドでは、フォーカスを設定してそこでスクロールしようとしますが、スクロールして先頭に戻ります。フォーカスはまだテキストボックスにありますが、画面の位置は一番上にあります。リンクは、ポストバックの原因となっている画面の上部にあります。画面の一番下までスクロールしたい。これを簡単に実行してから、右上にスクロールして戻ります。

設定してみました

Page.MaintainScrollPositionOnPostback = false;

しかし、それも助けにはならないようです。

特定の位置に移動させる方法はありますか？ボタンまたはリンクボタンを使用してポストバックするときにURLにアンカータグを追加することは可能ですか？

c#asp.netpostbackwebforms
25
Dismissile

_Page.MaintainScrollPositionOnPostBack = true;_は画面上の同じ位置に戻りますが、AJAXを使用するか、ポストバック後にSetFocus()を使用して特定のコントロールに焦点を合わせることができます。

http://msdn.Microsoft.com/en-us/library/ms178232.aspx

31
Theomax

場所のアンカーがある場合は、次のコードを使用できます。

Page.ClientScript.RegisterStartupScript(this.GetType(), "hash", "location.hash = '#MOVEHERE';", true);
30
dvdmn

あなたの場合、Page.MaintainScrollPositionOnPostBackのデフォルト値を保持し、純粋なjavascriptスクロール機能を使用することをお勧めします

function scrollToDiv()
{
    document.getElementById('yourDiv').scrollIntoView();
}

そして、ページの起動時に1msのわずかな遅延でそれを呼び出します（再び純粋なjavascript）

setTimeout(scrollToDiv, 1);

そして最後に、C＃コードビハインドからRegisterStartupScriptを使用して呼び出します（すべてのページが読み込まれた後、jsが実行されます）。

ScriptManager.RegisterStartupScript(Page, typeof(Page), "ScrollToADiv", "setTimeout(scrollToDiv, 1);", true);

このように、それはaspの自動スクロールをバイパスします

7
Matthieu Charbonnier

これを試して

protected void Page_Load(object sender, EventArgs e)
    {
        if (Page.IsPostBack) {
            string targetId = Page.Request.Params.Get("__EVENTTARGET");
            Page.ClientScript.RegisterStartupScript(this.GetType(), "focusthis", "document.getElementById('" + targetId + "').focus()", true);

        }
    }
0
Rana

これは、asp.netコントロールの目的のDivに自動的にスクロールします。これは、どこからでも呼び出すことができる関数です。また、Javaスクリプトファイル

OnClientClick = "return scrollGrid（）"

function scrollGrid1（）{$（ 'html、body'）。animate（{scrollTop：$（ '＃Div1'）。offset（）。top}、 'slow'）}

0
Suraj

私が持っています

<asp:MultiView ID="mvAriza" runat="server">
      <asp:View ID="View14" runat="server"> 
         ............ .......
      </asp:View>
</asp:MultiView>

* .aspxページ。そして、*。aspx.csページのボタンをクリックします。

Page.SetFocus(mvAriza.ClientID);

それは素晴らしい作品です。

0
Hysen

Page.MaintainScrollPositionOnPostback = trueはうまく機能しているようです。

0
Mike S.

Matthieu Charbonnier answer を試しましたが、追加しない限り機能しませんでした

" window.scrollTo = function () { };"

http://gnidesign.blogspot.com.au/2011/06/how-to-maintain-page-scroll-on-postback.html で提案されたとおり

Chrome、FireFox、IEで動作するヘルパーメソッドを作成しました

public static void ScrollToControl( Page page, string clientId, bool alignToTop)
 {
     //NOTE: if there are more than one call on the page, first one will take preference
     //If we want that last will take  preference, change key from MethodBase.GetCurrentMethod().Name to anchorName
     //recommended in http://gnidesign.blogspot.com.au/2011/06/how-to-maintain-page-scroll-on-postback.html              
     String script = " window.scrollTo = function () { };" + Environment.NewLine;
     script += String.Format("document.getElementById('{0}').scrollIntoView({1});" , clientId, alignToTop.JSToString());
     page.ClientScript.RegisterStartupScript(TypeForClientScript(), MethodBase.GetCurrentMethod().Name, script, true );
     //return script;
 }
 public static string JSToString(this bool bValue)
 {
     return bValue.ToString().ToLower();
 }

GetElementById（ '{0}'）。scrollIntoViewを使用するのは、余分なアンカー要素を追加する必要がないため、location.hashより簡単です。

パラメーターalignToTopは、画面の上部または下部にコントロールを表示するかどうかを指定するのに非常に便利です。

0
Michael Freidgeim