Identifying main submit button for a form - html

I have a form which has a few text boxes, and two submit buttons. When a text box is selected, and I press Enter, the first submit button is triggered. However, this is not the button that should be pressed at that time. How can I make it so that when the Enter button is pressed, the second submit button (or at least, the last occurrence of the submit button) clicked?
I have an implementation of this currently using JavaScript, but I'm hoping there is a native option for it.

Its pretty tough to get more native than javascript. You're gonna need it here. By the way, the behavior you noticed is the expected behavior. The first submit button in your html is the one that will get sent with your header.
I guess if you really didn't want to use js, you could just put the other button first and then use css to position them correctly on the page itself.

If you are using asp .net then you can use "UseSubmitBehavior" property on the button. See below code.
<asp:TextBox runat="server" ID="txt1"></asp:TextBox> <br/>
<asp:Button runat="server" ID="btn1" UseSubmitBehavior="False" Text="1" OnClick="test1"/> <br/>
<asp:Button runat="server" ID="btn2" UseSubmitBehavior="True" Text="2" OnClick="test2"/>

Related

Change Input value and Placeholder

COUNTER COUNTER EDIT:
Sorry for obvious question, my edits keep getting deleted but was just saying been working non stop and had a complete blank when trying to remember this, thanks to the Stack community though!
I have my HTML here:
<input type="submit" name="buddy1" value="Yes" placeholder="Toggle Yes">
I want the input value to be Yes but the text displayed to be "Toggle Yes". I know there's a trick with span classes and buttons but I want the button to also be the submit. Is there a quick way of doing this WITHOUT Javascript?
You can use the <button></button> instead:
<button type="submit" name="buddy1" value="Yes">Toggle Yes</button>
Your should use a button element, where you can change the text of the button. Buttons elements are just input elements which have more options. From the w3 site on button:
Buttons created with the BUTTON element function just like buttons created with the INPUT element, but they offer richer rendering possibilities:
For example.
<button type="submit" name="buddy1" value="Yes">Toggle Yes</button>

Attribute <A> link for radiobutton not working in Chrome

<a> link for radion button is not working in Chrome. My code:
<td width='7%' bgcolor='#E8E8E8'>
<a href='issue.php?admin=Yes&&user=$user'>
<input type='radio' name='admin$user' $adminright />Y
</a>
</td>
When the user clicks on the option button it should take to issue.php. This works fine in Firefox but not in Chrome.
What's wrong?
You'll need JavaScript to redirect a user when he clicks on a form control other than a submit button.
However, think for a second, that's not what the user expects to happen. A radio button is expected to make a single selection out of a group of related options. It's not expected for the control to take you to a different page.
Instead, consider an actual form, with a submit button.

CancellableFormController and 2 submit buttons

It seems that my CancellableFormController picks the first of the 2 submit buttons' action if Enter is pressed on the form.
i.e. if my successView is success.jsp and cancelView is cancel.jsp and on my form Cancel button appears before Register, cancel.jsp is called when I hit enter.
Why is this happening. Code for my buttons is:
<input type="submit" name="cancel" value="<spring:message code="submit.cancel"/>"/>
<input type="submit" value="<spring:message code="submit.register"/>"/>
Can I change this?
If you have two separate submit buttons in your jsp does not mean that your controller will perform differently based on that.
The thing here is whenever you submit any of the button it will perform the same action defined in the form tag.
You need to have two separate forms for each submit button and they must have the separate actions defined in it.

HTML form - normal button prevents submitting the form on Enter

I have a form with some
<button>
elements and a normal
<input type="submit">
button to submit the form.
However, when I press Enter when I'm in a textfield, the form does not get submitted but much rather the first Element is "pressed".
How can I change this behavior?
I would recommend changing the <button> tag and turning it into an <input type="button" /> tag. This should force the form to submit the way you want.
You can use javascript to capture that the Enter key was pressed and submit the form.
See this example.
For a complete answer, could you please post your HTML?

HTML: What determines the 'move the focus to the next control when Enter is hit' behavior

A basic HTML question. Is it possible on an HTML page to declaratively achieve a behavior when pressing Enter in a textbox moves the focus to the next control? How do you achieve it and how do you turn it off? Or maybe the dynamic javascript part should be involved here?
For exaple, the following HTML in IE7 does not allow to move to the focus to the next textbox with enter:
<html>
<body>
<form>
<table>
<tr><td>
<input type="text" name="i1"/>
<td></tr>
<tr><td>
<input type="text" name="i2"/>
<td></tr>
</table>
</form>
</body>
</html>
I have a page where I need to get rid of this 'move the focus to the next control when Enter is pressed' behavior.
#Edit: The example above turns out to be incorrect. The control the focus jumps to when I press enter on the page I want to avoid this behavior on is actually of type submit. The strange thing is that this "submit" is a part of a Telerik tree control and is not a submit button but an arrow used to collapse and expand the tree structure.
So I assume the focus jumps to the next submit control which the Browser expects to be a normal submit button which is not true in my case.
So I suppose I should look for a Telerik pecific solution here.
In most browsers, pressing Enter when focused within a form will submit the form. If you need to change this behavior so that pressing Enter moves to the next textbox you will need to use javascript.
Try this: (courtesy of javascript.internet.com)
http://javascript.internet.com/forms/tab-key-emulation.html
<input type="text" name="i1" Tabindex="[order number]"/>
I usually lookup these things on:
http://start.gotapi.com/