web-dev-qa-db-ja.com

検証に失敗した後、ページが最上位にジャンプしないようにするにはどうすればよいですか?

いくつかのTextBoxと送信ボタンを持つ単純なaspxページがあります。一部のフィールドは必須で、ボタンの下にはValidationSummaryがあります。完全なフォームは画面の高さよりも大きいため、送信ボタンに到達するには下にスクロールする必要があります。すべての必須フィールドに入力せずに送信をクリックすると、検証が失敗し、検証の概要でボタンの下に情報メッセージが表示されます。検証はクライアントで行われ、ポストバックは行われません。

したがって、これはすべて希望どおりに機能します。しかし、気になるのは、送信ボタンをクリックすると、ページが最上位に移動(「ジャンプ」)することです。検証の概要を表示するには、ページをもう一度下に移動する必要があります。

私はShowSummaryプロパティをfalseに設定しようとしました(あまり意味がありません):検証はまだ機能しています(ポストバックなし)が、この場合、ページは上に移動しませんポジション。したがって、問題は検証テキストのレンダリングに依存しているようです。

このページジャンプを防ぐ方法はありますか?

前もって感謝します!

更新:

上記で説明した動作は、ブラウザに依存していないようです。私は5つの異なるブラウザーでテストしましたが、どこでも同じです。

24
Slauma

私はasp.net( http://forums.asp.net/p/1545969/3779312.aspx )で質問し、2つのソリューションで返信を得ました。より良いのは、スクロール位置を維持する次のJavascriptです。

<script type="text/javascript">
    window.scrollTo = function( x,y ) 
    {
        return true;
    }
</script>

これはページに置くだけで、呼び出す場所はありません。

他の解決策は、ここでのRioTeraの提案(MaintainScrollPositionOnPostBackを使用)に似ていますが、ポストバックを強制するためにEnableClientScript="false"をバリデーターに追加します。それも機能しますが、価格は人工的なポストバックです。

32
Slauma

PageプロパティMaintainScrollPositionOnPostBackを使用できます。

コードビハインドで:

Page.MaintainScrollPositionOnPostBack = true;

またはあなたのウェブフォームで:

<%@ Page Language="C#" AutoEventWireup="true"  CodeFile="Default.aspx.cs" Inherits="_Default" MaintainScrollPositionOnPostback="true" %>
23
riotera

ページフォーカスを設定してみてくださいPage.SetFocus(control);グリッドビューに行を追加する挿入ボタンがあります。これは、ページ上の多くのアイテムの1つであり、最後のメソッドとしてPage.SetFocus(control)を追加できます。私のbtnInsert_Clickイベントで。

6
Kate

プロパティを設定していることがわかりました:

maintainScrollPositionOnPostBack="true"

あなたのWeb.config <pages>セクションはうまく機能します。

4
Freddie

ページ全体がサーバーにポストバックされ、コンテンツがサーバーから再度送信されるため、ページがちらつきます。更新する場所を囲むには、UpdatePanelタグを使用する必要があります。タグ内にある情報のみをポストバックします

<asp:ScriptManager ID="ScriptManager1" runat="server" />
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
    <!-- Place updatable markup and controls here. -->
</ContentTemplate>
</asp:UpdatePanel>

読む http://msdn.Microsoft.com/en-us/library/bb386573(v = vs.100).aspx#CodeExamples

1
Trio Cheung

私はMVC5を使用しています。ジャンプを停止する唯一の方法は、以下のJQueryコードを使用することでした。

私はSafari、Chrome、Mozilla、Internet Explorer、Operaでソリューションをテストしました。

$(document).scrollTop($('form#formCheckout').offset().top);
    event.stopPropagation();
    event.preventDefault();
0
Oscar Fuquen

残念ながら、MantainScrollPositionOnPostbackは最近のブラウザーでは機能しなくなりました。クロスブラウザー互換ソリューションの場合は、次のスニペットを使用できます(jQueryが必要)。

<asp:HiddenField runat="server" ID="hfPosition" Value="" />
<script type="text/javascript">
    $(function () {
        var f = $("#<%=hfPosition.ClientID%>");
        window.onload = function () {
            var position = parseInt(f.val());
            if (!isNaN(position)) {
                $(window).scrollTop(position);
            }
        };
        window.onscroll = function () {
            var position = $(window).scrollTop();
            f.val(position);
        };
    });
</script>

私の回答 こちら も参照してください。

0
Darkseal