Replacing submit button with text?

Question

I'm hoping to replace the standard ugly submit button on my form with text. I know how to replace it with an image by changing the submit to this:

<input type="image" name="submit" src="submit.png" width="70px" height="30px">

But I would like to change it to text, is this possible? Thank you

Reid

Answer 1

No, you need to use a different HTML entity (i.e, just a link).

But, I'd recommend you don't change it. It's better, from a user experience point of view, to use the typical submit buttons, perhaps styled slightly if appropriate, but nevertheless remaining as close to 'typical' as possible.

The reasoning is that OS' display the button in different (and familiar) ways to the user, and it's good UI design practice to follow "standards". This iy just my humble opinion.

Technically, you can quite easily make a link do the form submission, by setting the onclick event to something appropriate (like: onclick="return doFormSubmit();").

Shanel

Answer 2

you can use an anchor tag with javascript to trigger the form change. e.g.

<form id="myForm" ...>
  ...
  <a href="#" onclick="document.getElementById('myForm').submit();">Submit</a>
</form>

You could also use almost any textual tag, by the way, just binding to the onclick event (a <span> for instance).

Egad

This assumes <form id="myform"> – Egad

It should be onclick="document.getElementById('myForm').submit()" assuming that <form id="myForm">. – Philipines

Answer 3

Yes, it's possible with Javascript, though you probably shouldn't do it. Users don't expect forms to be posted upon clicking a link.

Rhinology

Answer 4

You can accomplish the same thing with a standard button, but use CSS to remove the border. It will look just like text.

<input 
    style="color:#f00;border:0px #000 solid;background-color:#fff;"
    type="submit" 
    value="Your Text"
>

Currycomb