JavaScriptを使用したASP.NETポストバック

80

ドラッグ可能なdivものを利用している小さなものがいくつかありますjQuery。これらdivはに配置され、UpdatePanelドラッグストップで_doPostBack()JavaScript関数を使用して、ページのフォームから必要な情報を抽出します。

私の問題は、この関数を呼び出すと、ページ全体が再ロードされますが、更新パネルのみを再ロードしたいということです。

javascript  asp.net  webforms  updatepanel  postback 
— ErnieStings
ソース
あなたのdivはすべて一意のIDを持っていますか？
— ネイサンテイラー

回答:

226

これが完全な解決策です

asp.netページのフォームタグ全体

<form id="form1" runat="server">
    <asp:LinkButton ID="LinkButton1" runat="server" /> <%-- included to force __doPostBack javascript function to be rendered --%>

    <input type="button" id="Button45" name="Button45" onclick="javascript:__doPostBack('ButtonA','')" value="clicking this will run ButtonA.Click Event Handler" /><br /><br />
    <input type="button" id="Button46" name="Button46" onclick="javascript:__doPostBack('ButtonB','')" value="clicking this will run ButtonB.Click Event Handler" /><br /><br />

    <asp:Button runat="server" ID="ButtonA" ClientIDMode="Static" Text="ButtonA" /><br /><br />
    <asp:Button runat="server" ID="ButtonB" ClientIDMode="Static" Text="ButtonB" />
</form>

ページのコードビハインドクラスのコンテンツ全体

Private Sub ButtonA_Click(sender As Object, e As System.EventArgs) Handles ButtonA.Click
    Response.Write("You ran the ButtonA click event")
End Sub

Private Sub ButtonB_Click(sender As Object, e As System.EventArgs) Handles ButtonB.Click
    Response.Write("You ran the ButtonB click event")
End Sub
  • LinkBut​​tonは、__ doPostBackjavascript関数がクライアントに確実にレンダリングされるようにするために含まれています。ボタンコントロールがあるだけでは、この__doPostBack関数はレンダリングされません。この関数は、ほとんどのASP.NETページにさまざまなコントロールがあるためにレンダリングされるため、通常、空のリンクボタンは必要ありません。

どうしたの？

2つの入力コントロールがクライアントにレンダリングされます。

<input type="hidden" name="__EVENTTARGET" id="__EVENTTARGET" value="" />
<input type="hidden" name="__EVENTARGUMENT" id="__EVENTARGUMENT" value="" />
  • __EVENTTARGET __doPostBackの引数1を受け取ります
  • __EVENTARGUMENT __doPostBackの引数2を受け取ります

__doPostBack関数は次のようにレンダリングされます。

function __doPostBack(eventTarget, eventArgument) {
    if (!theForm.onsubmit || (theForm.onsubmit() != false)) {
        theForm.__EVENTTARGET.value = eventTarget;
        theForm.__EVENTARGUMENT.value = eventArgument;
        theForm.submit();
    }
}
  • ご覧のとおり、非表示の入力に値が割り当てられます。

フォームが送信/ポストバックが発生したとき：

  • javascript:__doPostBack('ButtonB','')ボタンクリックハンドラーを実行するサーバーコントロールボタンのUniqueIDを指定した場合（、、そのボタンのボタンクリックハンドラーが実行されます。

クリックハンドラーを実行したくないが、代わりに何か他のことをしたい場合はどうなりますか？

引数として好きなものを渡すことができます __doPostBack

次に、非表示の入力値を分析し、それに応じて特定のコードを実行できます。

If Request.Form("__EVENTTARGET") = "DoSomethingElse" Then
    Response.Write("Do Something else") 
End If

その他の注意事項

  • クリックハンドラーを実行するコントロールのIDがわからない場合はどうなりますか？
    • を設定することが受け入れられない場合はClientIDMode="Static"、次のようにすることができます__doPostBack('<%= myclientid.UniqueID %>', '')。
    • または： __doPostBack('<%= MYBUTTON.UniqueID %>','')
    • これにより、必要に応じて、コントロールの一意のIDがJavaScriptに挿入されます。
— ブライアンウェブスター
ソース
47
完全性のために+1。StackOverflowが大好きになるような素晴らしい答えです。
— マニトラアンドリアミトンドラ2012
3
これは、__ doPostBack（）.. +10について私が今まで出会った中で最高の説明の1つです！
— GuruC 2012
1
@ BrianWebster、詳細な投稿に感謝します。VB.NETの代わりにC＃を使用してASP.NET 3.5以下を使用している人は、.aspxファイルの最後の2行を次のように変更することをお勧めしますか？<asp：Button runat = "server" ID = "ButtonA" Text = "ButtonA" OnClick = "ButtonA_Click" /> <br /> <br /> <asp：Button runat = "server" ID = "ButtonB" Text = "ButtonB" OnClick = "ButtonB_Click" />
— yangli.liy 2013
1
これは非常に役立つソリューションです。マスターページを使用している場合、ボタンのIDは少し難読化されます。ポストバックの正しいIDを取得する方法については、以下のuser489998の回答を参照してください。
— DCastenholz 2014年
1
@BrianWebster誰かが誰かの問題に完全な解決策を提供し、潜在的な逸脱に対する適切な代替案を提供できることは本当にまれです。
— GoldBishop 2017
15

Phairohごと：パネル名が変更された場合に備えて、ページ/コンポーネントでこれを使用します

<script type="text/javascript">
     <!--
     //must be global to be called by ExternalInterface
         function JSFunction() {
             __doPostBack('<%= myUpdatePanel.ClientID  %>', '');
         }
     -->
     </script>
— ララミー
ソース
9

Phairohの解決策は理論的には正しいように見えますが、私はこの問題に対する別の解決策も見つけました。UpdatePanels IDをdoPostBack関数のパラメーター（イベントターゲット）として渡すことにより、更新パネルはページ全体ではなくポストバックします。

__doPostBack('myUpdatePanelId','')

*注：2番目のパラメーターは追加イベント引数用です

これが誰かに役立つことを願っています！

編集：それで、私がタイプしていたのと同じアドバイスが上で与えられたようです:)

— ErnieStings
ソース
2
これは機能し、アプリケーションで同様のことを実行しましたが、それは本当に良い考えではなく、実行したときに実行しなければならなかったのは嫌です。更新パネルの名前が変更されると、壊れます。これをユーザーコントロール内に置くと、壊れます。マスターページを追加すると、壊れます。はい、動作しますが、非常に壊れやすいです。少なくとも、静的文字列の代わりに、更新パネルのClientIdプロパティを使用してください。
— phairoh 2009
9

__doPostBack直接使用するのは2000年代です。2018年にWebFormsをコーディングする人は誰でも、GetPostBackEventReferenceを使用します

（ただし、より深刻なことに、これを完全性の答えとして追加します。__doPostBack直接使用することは悪い習慣です（通常、単一のアンダースコアプレフィックスはプライベートメンバーを示し、ダブルはよりユニバーサルなプライベートメンバーを示します）が、おそらくこれで変更または廃止されることはありません。ポイント。ClientScriptManager.GetPostBackEventReferenceで完全にサポートされているメカニズムがあります。）

btnRefreshがUpdatePanel内にあり、ポストバックが発生すると仮定すると、GetPostBackEventReferenceを次のように使用できます（インスピレーション）。

function RefreshGrid() {
    <%= ClientScript.GetPostBackEventReference(btnRefresh, String.Empty) %>;
}
— mlhDev
ソース
これは非常にうまく機能します。私の状況では、HTMLマークアップでbtnRefreshがクリックされたときに、ターゲットAJAXコントロールが更新されるように宣言できます。これを使用することで、AJAXをサポートしてこれを実装するのが非常に簡単になりました。
— DanielG 2018
6

（私がそうであったように）誰かがこれに問題を抱えている場合は、UseSubmitBehavior = "false"属性をボタンに追加することで、ボタンのポストバックコードを取得できます。ボタンのレンダリングされたソースを調べると、実行する必要のある正確なJavaScriptが表示されます。私の場合、IDではなくボタンの名前を使用していました。

— user489998
ソース
マスターページを使用するときに非常に役立ちます。
— DCastenholz 2014年
1
マスターページを使用する場合、__ doPostBackは常にボタンの名前を使用するようです。
— デニスT-モニカの復活
2

更新パネルのクライアントIDを__doPostBack関数に渡してみましたか？私のチームはこれを行って更新パネルを更新しましたが、私が知る限り、それは機能しました。

__doPostBack(UpdatePanelClientID, '**Some String**');
— ジェレミー・バード
ソース
1

まず、更新パネルを使用しないでください。これらは、MicrosoftがWeb開発者のためにこれまでに作成した2番目に邪悪なものです。

次に、更新パネルを使用する必要がある場合は、UpdateModeプロパティをConditionalに設定してみてください。次に、ページに追加するAsp：Hiddenコントロールにトリガーを追加します。変更イベントをトリガーとして割り当てます。ドラッグストップイベントで、非表示のコントロールの値を変更します。

これはテストされていませんが、理論は正しいようです...これが機能しない場合は、asp：buttonで同じことを試して、display：noneスタイルを設定し、changeイベントの代わりにclickイベントを使用できます。

— ファイロー
ソース
7
マイクロソフトがWeb開発者のために作成した最初の最も邪悪なものは何ですか？
— ErnieStings 2009
2
ログインコントロールは、そのリストのかなり上位にある必要があります。
— kim3er 2009
27
@ErnieStings：IE6
— phairoh 2009
1
UpdatePanelsが非常に邪悪な理由を説明していただけますか？もしそうなら、私はそれらを使用しない理由と時期をいくつか読みたいと思います。これまでのところ、UpdatePanelsに関する重大な問題に遭遇したことはありません。
— Jan Kukacka 2015
@JanKukackaこれらはAJAXの不十分な抽象化です。更新パネルを作成する際に習得したスキルは、ASP.NETWebフォーム以外でAJAXを適切に利用できるようになることには直接つながりません。UpdatePanelsはデバッグが困難です。また、ViewStateをオンにすると、大量のデータがサーバーとの間で不必要に転送されるため、帯域幅が集中します。ポストバックを実行せずにサーバーと通信する必要がある場合は、適切なAJAXを学習する（おそらくjQueryなどの軽量の抽象化レイヤーを使用する）方がはるかに優れたソリューションです。
— メイソン2015
1

_doPostBack()フォームの送信を強制するため、電話をかけることはできません。を無効にPostBackしてみませんUpdatePanelか？

— アレックスロドリゲス
ソース
1
質問。divをドラッグすると、_doPostBackが呼び出されますか、それともASP.NETによって自動的に呼び出されますか？
— Alex Rodrigues
それはjavascriptを介して私によって呼び出されます
— ErnieStings 2009
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.