1

次のように、updatepanel にラップされた asp.net にテキスト ボックスとボタンがあります。

 <asp:UpdatePanel ID="UpdatePanel21" runat="server" UpdateMode="Always" >
             <ContentTemplate>
                <asp:TextBox ID="txtLIDescription" runat="server" Columns="50">
                </asp:TextBox>
                 &nbsp;<asp:Button ID="btnAddLineItem" runat="server" onclick="btnAddLineItem_Click" 
                     Text="Add" ToolTip="Add line item." UseSubmitBehavior="false" />
                        </ContentTemplate>
        </asp:UpdatePanel>

ボタンをクリックすると、すべてが期待どおりに機能します。しかし、Enter キーを押すと (私のユーザーはそうすると思います)、システムはポストバックを行うようです。jqueryを使用して回避しようとしました:

  $('#LineItemContent_txtLIDescription')
         .livequery('keyup', function (event) {
             if (event.keyCode == 13) {
                 $('#LineItemContent_btnAddLineItem').focus();
                 $('#LineItemContent_btnAddLineItem').click();
             }
             $("#LineItemContent_btnAddLineItem").button();
         });

を配置するalert("hello world");と、if 条件に入ったので、Enter がクリックされたことがわかります。次に、通常のエンド ユーザーがボタンをクリックするのと同じように、ボタンにフォーカスを設定してボタンをクリックさせたいと考えていました。いいえ、ポストバックするようです。

追加してみました:

event.preventDefault();
return false;

それを回避することを望んでいるjqueryでは、同じことはありません。ASP.net マークアップも試して追加しました

UseSubmitBehavior=false

そして、ページはまだ投稿されているようです。これは updatepanel 内にあるためですか? これを回避する他の方法はありますか??

4

1 に答える 1

2

UpdatePanelのコンテンツをa にラップして、そのプロパティを にPanel設定することができます。DefaultButtonbtnAddLineItem

編集:「問題は、なぜこれが機能するのかです...」

最初に問題の原因: Enter キーを押したときにフォームの最初のボタンがクリックされるのは ASP.NET 固有ではありません。これは通常の動作です。ただし、UpdatePanel は、ポストバックの原因となったコントロールが UpdatePanel 内にある場合にのみ、非同期ポストバックを実行します。AsyncPostBackTriggerそれ以外の場合は、そのコントロールに対して明示的に指定する必要があります。

私のアプローチは、ユーザーがそのパネル内で入力をクリックしたときに、適切なボタン (UpdatePanel 内) が確実にクリックされるようにするため、機能します。これにより、必要に応じて非同期ポストバックが発生します。

これはハックではなく、ASP.NET 2.0 で導入された便利な機能です。あなたのコードは読みやすく、「javascript ハック」を使用する必要はありません。

于 2012-04-24T22:34:55.070 に答える