2009-04-13 48 views
5

ユーザーにテキストボックスを使用してEnterキーを押してもらいたいです。課題は、5つのテキストボックスと2つのオプションがあることです。 3つのテキストボックスは1つのボタンに属し、2つのテキストボックスは他のボタンに属します。ユーザーがEnterキーを押したときに入力したテキストボックスに従って、特定のボタンをどのようにトリガーしますか?5テキストボックス、2ボタン。ボタンにテキストボックスを割り当てる方法は?

+0

あなたは "割り当て" とは何を意味するのですか? –

+0

指定したボタンをクリックした後にテキストボックスに入力された内容を知りたいですか? – TStamper

+0

私は彼が各テキストボックスの "入力"ボタンを望んでいると思う。そのため、TextBox "A"にフォーカスがあるときにリターンキーを押すと、ボタンイベントが発生し、別のTextBoxのボタンが表示されます – Inisheer

答えて

12

これは、私が別のユーザータイプの2つの異なるログインフォームを持つページを自分で作成したものです。私がしたことは、2つのフォームをそれぞれ独自のASP Panelコントロールと、DefaultButtonを設定しているパネルで区別することでした。こうすることで、フォームに入力してEnterキーを押すと、正しいボタンで送信されます。

<asp:Panel id="panel1" DefaultButton="button1"> 
    <asp:textbox id="textbox1"/> 
    <asp:textbox id="textbox2"/> 
    <asp:buton id="button1"/> 
</asp:panel> 

<asp:panel id="panel2" DefaultButton="button2"> 
    <asp:textbox id="textbox3"/> 
    <asp:textbox id="textbox4"/> 
    <asp:button id="button2"/> 
</asp:panel> 

EDIT:ここではあなたのテキストボックスにONKEYPRESSプロパティを割り当てることによって、それを行う方法のanother methodです。 これは私が例 TOP AT

を説明したものとは別のソリューションです:

function clickButton(e, buttonid){ 
    var evt = e ? e : window.event; 
    var bt = document.getElementById(buttonid); 
    if (bt){ 
     if (evt.keyCode == 13){ 
      bt.click(); 
      return false; 
     } 
    } 
} 

//code behind 
TextBox1.Attributes.Add("onkeypress", 
    "return clickButton(event,'" + Button1.ClientID + "')"); 

をコードが背後にある次のコードを生成します。これはかなりあるjQueryを使用して

<input name="TextBox1" type="text" id="TextBox1" onkeypress="return 
    clickButton(event,'Button1')" /> 
+0

ほとんど邪魔にならない – roosteronacid

+0

@rooster:あなたはそのように感じてすみませます。明らかに、著者は、単純な問題を解決するために完全に別のjsライブラリを使用するよりも、目的を果たしていると感じました。 – TheTXI

+0

@TheTXI:ソリッドソリューション、はい。しかし、それは目立たないものではありません。また、それは明らかに様々な技術を分離していません。 (再投稿)。 – roosteronacid

1

を達成しやすい:

$(function() 
{ 
    $("#id-of-textbox-1, #id-of-textbox2, etc.").keyup(function (e) 
    { 
     if (e.keyCode === 13) $("#id-of-submit-button-1").click(); 
    }); 

    // And for the second group 

    $("#id-of-textbox-3, #id-of-textbox4, etc.").keyup(function (e) 
    { 
     if (e.keyCode === 13) $("#id-of-submit-button-2").click(); 
    }); 
}); 

ASP.NET ボタンコントロールを使用している場合、これらのコントロールにはUseSubmitBehaviorのプロパティを必ずfalseに設定してください。

+0

もちろん、Javascriptが無効になっている場合は失敗します... ASP.NET iircはすべてのコントロールを単一のフォームにラップするので、JSも無効になっている場合は他の方法と同じです。 – Powerlord

+0

.netは要素のIDを混乱させることを覚えておいてください。 "#id-of-textbox-1"の代わりに<%= textbox1.ClientID%>を使用してください。 – rmw

+0

R. Bemrose:ありがとうございました:) – roosteronacid

4

この状況では、関連するテキストボックスとパネル内のボタンをグループ化します。 Panelには、使用できるDefaultButtonプロパティがあります。 DefaultButton = "IdOfTheDefaultButtonForControlsInThisPanel"

http://msdn.microsoft.com/en-us/library/system.web.ui.webcontrols.panel.defaultbutton.aspx

+0

TXIは私にそれを打つ。 – rvarcher

+0

@rvarcher:新しい回答が投稿された回答を作成する際にあなたのページに警告が表示された場合、誰かがあなたを殴った場合に備えて読み込むことができます。しかし、試みのために+1。 – TheTXI

関連する問題