Enter key triggers wrong submit button

Question

I am working on an mvc application. Two tables each have their individual submit button. Table1 has default submit on enter key. How do I change the submit button based on textbox focus?

<table>
...<td align="left"><%= Html.TextBox("name")%></td>
...<input id="nameSubmit" name="NameSubmit" type="submit" value="Search"/>
</table>
<table>
...<td align="left"><%= Html.TextBox("idNum")%></td>
...<input id="idSubmit" name="IdSubmit" type="submit" value="Search"/>
</table>

I tried using the panel, but "the DefaultButton of 'Panel1' must be the ID of a control of type IButtonControl".

Any ideas?

Answer 1

If you wrap each of the submits in <form> tags that should help determine which submit was clicked as such:

<table>
    <form id="form1">
        <td align="left"><input id="name" /></td>
        <input id="nameSubmit" name="NameSubmit" type="submit" value="Search"/>
    </form>       
</table>
<table>
    <form id="form2">
        <td align="left"><input id="number" /></td>
        <input id="idSubmit" name="IdSubmit" type="submit" value="Search"/>
    </form>
</table>

This would make any Enter presses while the textbox was focused submit to the corresponding form.

Here is a demo of this working, I hope that it helps you out.