Set default button in the form tag

[dc2000]

Hello everyone:


Can someone tell me if form has several submit buttons how to set a default among them (the button that will respond to the Enter keystroke) using JavaScript?

<form method="POST" action="submit.php" id=idFrm>
<p><input type="text" name="T1" size="20">
<input type="submit" value="Submit Used as Default in HTML" name="B1" id=idBtn1></p>
<p></p>
<p><input type="submit" value="Submit I want to be default" name="B2" id=idBtn1></p>
</form>

Thank you...

[Exuro]

Try this:
<form method="POST" action="submit.php" id=idFrm>
<div style="display:none;"><input type="submit" value="Submit I want to be default" name="B2"></div>
<p><input type="text" name="T1" size="20">
<input type="submit" value="Submit Used as Default in HTML" name="B1" id=idBtn1></p>
<p><input type="submit" value="Submit I want to be default" name="B2" id=idBtn1></p>
</form>

[dc2000]

Hey, thanks. It's an interesting solution. I'll try...

[dc2000]

Tried your sample, but unfortunately my IE still doesn't see that invisible button (not untill I remove that "style" tag). I'm not really good at DHTML and their object model but what about intercepting Enter keystroke?

[felgall]

The invisible button comes first in the form and is therefore the one that is the default used when the enter key is pressed. The other two show and can be clicked on with the mouse. You don't need to remove the style code that is hiding the first button as the third button is the visible equivalent for mouse use.

Nice solution, I never would have thought of it but it is the obvious way to set the default to what you want without needing Javascript and since the people most likely to be using the keyboard to submit the form are those without Javascript a much better solution than any javascript one would be..

[dc2000]

Stephen, I'm not making it up. The sample above does not work. I just tried it as I stated above. When button is invisible, the IE6 skipped it and went to the next one.

[Cytael]

if you want a user to select between two options (buttons), wouldn't the better choice be to use a pair of radio buttons instead of multiple submits?

[Kravvitz]

Try giving it visibility:hidden instead of display:none. You can absolutely position it off the left side of the screen in addition to giving it visibility:hidden, if you want.

[Exuro]

Stephen, I'm not making it up. The sample above does not work. I just tried it as I stated above. When button is invisible, the IE6 skipped it and went to the next one.
I'd actually say Cytael's solution is best, but... What happened with you was totally different than my results. For me, in IE6, when the form was submitted with the Enter key it doesn't show any buttons in the query string... In that case, you could just assume that blank==default.

Try it again and see if the same thing happens.

[dc2000]

Sorry guys for making you wait. Somehow I didn't get notification for this thread :(

if you want a user to select between two options (buttons), wouldn't the better choice be to use a pair of radio buttons instead of multiple submits?No, actually it wouldn't. I have a form with a list where each item on the list has its own "Remove" button and then at the end there's "Add New" button to add new element. So, as you can imagine when someone tries to add new element and hits enter they get to remove button action..... :eek:

Try giving it visibility:hidden insteadYeah, this one worked. THANKS!!! The only bad part is that though being invisible the button still takes space. Is there any way to shrink it?

[felgall]

Why not use position:absolute with it which will take it out of the document flow.

[dc2000]

Why not use position:absolute with it which will take it out of the document flow.Yeah, sounds as a plan, but how will I know the size of the screen to place it outside?

[Exuro]

No, actually it wouldn't. I have a form with a list where each item on the list has its own "Remove" button and then at the end there's "Add New" button to add new element. So, as you can imagine when someone tries to add new element and hits enter they get to remove button action..... :eek: It'd seem like a better solution would be having two separate forms for this. The "Add New" elements shouldn't be dependent at all upon the currently existing elements, right? So you could just make it into two separate forms and avoid this whole fiasco.

If I'm understanding correctly, you also have a "remove" submit button in each row? Instead perhapses you could exchange this for a checkbox, and then at the bottom of the page have a "Remove Selected Elements" submit button. Would that work?

I would strongly suggest doing everything you can to avoid using multiple submit buttons. I don't know if the standardized functionality for that would even be documented anywhere, and if it is I doubt that it's globally supported since it's such a strange case...

If the solution I offered doesn't sound like it would work for your page you could give us more details and we could come up with something else. I'd feel much better about helping you find a solution which doesn't involve multiple submit buttons and doesn't require any javascript for the basic functionality.

[dc2000]

Thank you, Exuro, for your detailed reply. I was leaning towards what you suggested too. The only thing that was stopping me is the fact that I'd have to redo both client and server parts of the script, which is not really something I'd want to go into. The only thing that I'd need to avoid is a "mass-removal" option, which could be available with the use of check boxes next to each line in the list. The reason for that is simple precaution. At the current stage we require typed-in confirmation for a single removal, let alone for more than one item. But that's an idea too. Now I have to come about to program all those changes to quite an extensive form. Thanks again.

[Exuro]

The only thing that I'd need to avoid is a "mass-removal" option, which could be available with the use of check boxes next to each line in the list. The reason for that is simple precaution. At the current stage we require typed-in confirmation for a single removal, let alone for more than one item.
Two things to say about this:

First, if you're using a checkbox, they have a chance to look at everything again and uncheck it if necessary before deletion, so maybe you wouldn't need the confirm dialog...

Second, from the sound of things, I think you could just change each row or whatever into its own form and then there's no more submit button ambiguity! Plus, if you did it that way I don't think you'd have to change any of your server-side code!

[dc2000]

Thanks for suggestions. I'll try...