5 Textbox, 2 Buttons. How to assign textBox to Button?

Question

I want to give my users the option to use a textbox and press Enter. The challenge is that I have 5 textbox, and 2 options. 3 textbox belong to one button, and 2 textbox to the other. How do I trigger a particular Button according to the textbox the user was in when he press Enter?

Answer 1

I accomplished this on my own where I had a page with two different login forms for the different user types. What I did was separate the two forms into their own ASP Panel controls and on the panel setting the DefaultButton to whichever one I wished. That way when they finished typing in the form and hit the enter key, it would submit on the correct button.

Example:

<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: Here is another method of how to do it by assigning an OnKeyPress property to your textboxes. THIS IS A SEPARATE SOLUTION THAN THAT WHICH I DESCRIBED AT THE TOP

Example:

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 + "')");

The code behind generates the following code:

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