web-dev-qa-db-ja.com

ユーザーがテキストボックスでEnterキーを押したときにボタンクリックイベントを実行する

<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
<asp:Button ID="Button1" runat="server" onclick="Button1_Click" Text="Send" />
</ContentTemplate>
</asp:UpdatePanel>

ユーザーがButton1でEnter keyを押したときにTextbox1クリックイベントを実行する必要があります

c#javascriptasp.net
37
jams

Aspxページ読み込みイベントで、onkeypressをボックスに追加します。

this.TextBox1.Attributes.Add(
    "onkeypress", "button_click(this,'" + this.Button1.ClientID + "')");

次に、このjavascriptを追加してキーの押下を評価し、「入力」の場合は右ボタンをクリックします。

<script>
    function button_click(objTextBox,objBtnID)
    {
        if(window.event.keyCode==13)
        {
            document.getElementById(objBtnID).focus();
            document.getElementById(objBtnID).click();
        }
    }
</script>
17
Muhammad Akhtar

フォームをasp.netパネルコントロール内に配置し、ボタンIDでdefaultButton属性を設定します。以下のコードを参照してください。

  <asp:Panel ID="Panel1" runat="server" DefaultButton="Button1">
        <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
         <ContentTemplate>
            <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
            <asp:Button ID="Button1" runat="server" onclick="Button1_Click" Text="Send" />
             </ContentTemplate>
          </asp:UpdatePanel>
    </asp:Panel>

これがあなたを助けることを願っています...

83
Harun

Codeprojectには、これに対する完全なソリューションがあります。

http://www.codeproject.com/Articles/17241/Captureing-the-Enter-key-to-cause-a-button-click

そして記事が言うように：「あなたのニーズに最適なソリューションを決定する」

===================編集された回答===========================

上記のリンクでは、「Enter Key」イベントをキャプチャする2つの方法について説明しています。

Javascript（onKeyPressイベントをオブジェクトにバインドし、押されたキーを確認してロジックを実行するjavascript関数を作成します）

_Page_Loadのコードビハインド：_

 //Add the javascript so we know where we want the enter key press to go
if (!IsPostBack)
{
   txtboxFirstName.Attributes.Add("onKeyPress", 
                   "doClick('" + btnSearch.ClientID + "',event)");
   txtboxLastName.Attributes.Add("onKeyPress", 
                  "doClick('" + btnSearch.ClientID + "',event)");
}

Javascriptコード：

<SCRIPT type=text/javascript>
    function doClick(buttonName,e)
    {
        //the purpose of this function is to allow the enter key to 
        //point to the correct button to click.
        var key;

         if(window.event)
              key = window.event.keyCode;     //IE
         else
              key = e.which;     //firefox

        if (key == 13)
        {
            //Get the button the user wants to have clicked
            var btn = document.getElementById(buttonName);
            if (btn != null)
            { //If we find the button click it
                btn.click();
                event.keyCode = 0
            }
        }
   }
</SCRIPT>

パネル制御

<asp:Panel ID="panSearch" runat="server" DefaultButton="btnSearch2" Width="100%" >
    <asp:TextBox ID="txtboxFirstName2" runat="server" ></asp:TextBox>
</asp:Panel>

引用：

Panelタグには、DefaultButtonというプロパティがあります。このプロパティは、Enterキーを押すイベントでクリックするボタンのボタンIDに設定します。そのため、パネル内のテキストボックスは、Enterキーを押すと、パネルのDefaultButtonプロパティで設定されたボタンに移動します。

3
lienysd

hTMLコードのみで、ページのコントロールを含むパネルを追加します。パネル内に、DefaultButton = "buttonNameThatClicksAtEnter"という行を追加します。以下の例を参照してください。他に何も必要ないはずです。

<asp:Panel runat="server" DefaultButton="Button1"> //add this!
  //here goes all the page controls and the trigger button
    <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
    <asp:Button ID="Button1" runat="server" onclick="Button1_Click" Text="Send" />
</asp:Panel> //and this too!
1
DIZAD

あなたはjavascript/jqueryでそれを行うことができます：

<script>
    function runScript(e) {
        if (e.keyCode == 13) {
            $("#myButton").click(); //jquery
            document.getElementById("myButton").click(); //javascript
        }
    }
</script>

<asp:textbox id="txtUsername" runat="server" onkeypress="return runScript(event)" />

<asp:LinkButton id="myButton" text="Login" runat="server" />
0
live-love