HTML Image to submit form <Resolved />

hello people i havent done this in years and forgot :blush:

how do you use an image as a submit button for a form ?

in this case its a Go button for searching
eg:

Code:

---

<form action="search.asp?Mode=1" method="post" name="test">
<input name="txtsearch" type="text" size="10">

<!-- this is normal command button yeah-->

<input type="submit" name="Submit" value="Go">

<!-- i want an image for the button to submit the form-->
</form>

---

maybe just give the submit button a src attribute.
otherwise try using the <button><img src="" /></button>
This instead. But then I don't know how to make it submit without using JavaScript. To make JavaScript submit a form you do:
document.test.submit()

Something similar to this:

Code:

---

<form name="searchForm" action="page.php" method="post">
    <input type="text" name="searchTerm" />
    <img src="image.jpg" onclick="document.searchForm.submit();" alt="Click here to search" />
</form>

---

this will work, but also you can use the <input .../> tag. I've seen it done before.

yeah ive seen it before with the input tag too and i used to do it that way

Code:

---

<form name="searchForm" action="untitled-2.htm" method="post">
    <input type="text" name="searchTerm" />
    <input type="image" name="image" src="image.jpg" alt="click here" />
</form>

---

It passes the co-ordinates of where you clicked if I remember correctly.

if you change type="image" to type="submit" I think you'll get what you need.

Firstly; Changing the type to submit will turn the input into a button, which is not what he asked for.

Secondly; Why? What's wrong with what I posted?

He asked how to turn an image into a submit button. ie he wants a submit button which is an image. Unless of course I miss-understood it.

Nothing is wrong with what you posted, I just don't think that's what was being asked for.

Close, he wants to use an image as a submit button. So you've two choices; You can put some Javascript in an image's onclick to submit the form. So that it is now functioning as a submit button.

Or, you could set the input's type to image and give it a src property. When you click on the image, it submits the form. I thought that it passed the co-ords of where you clicked, but I just tested it and it doesn't appear to do so. Either way, the image is functioning as a submit button.

Ah yes I see you were right. I just had the wrong thing in my head, I should have checked before posting. sorry about that.

thanks for the help people ill give it a try

thanks again :)

Quote:

---

Originally posted by Acidic
Ah yes I see you were right. I just had the wrong thing in my head, I should have checked before posting. sorry about that.

---

No worries :)

Quote:

---

Originally posted by señorbadger
thanks for the help people ill give it a try

thanks again :)

---

No worries :)