Image As Button Problem :(

[frizzle]

Hi there,

I have a form on a contact page, and to make the layout
cross-browser/-platform i want to use an image as a button
instead of using an image as background on a button....

Problem: When i insert a (e.g.) reset-button, and change the source
type="button" to type="image", instead of resetting the form, it
submits the form....

Any clues?

Thanks...

Frizzle

[Deniz Adrian]

> Problem: When i insert a (e.g.) reset-button, and change the source

type="button" to type="image", instead of resetting the form, it
submits the form....

A type="image"-input always acts as a submit.
You can put javascript onclick to the picture.
e.g.

<image src="images/foo.jpg" onclick="document.frm1.reset();">

best regards
deniz adrian

[c.anandkumar]

you can submit the form thru javascript. sthg like <img
src="button.gif"
onClick="javascript:document.forms['formName'].submit();">

[Deniz Adrian]

> you can submit the form thru javascript. sthg like <img

src="button.gif"
onClick="javascript:document.forms['formName'].submit();">

as i understood, submitting isn't the problem, but resetting :)

[c.anandkumar]

of course, you can use any of the reset() or submit() methods on your
form. I was trying to suggest that you dont use input, instead you can
use img as well and get through.
Thanks
Anand

[frizzle]

Well, i use the same method for both buttons now,
so thank you guys. Is this method cross-browser/platform?

[c.anandkumar]

as far as i know both IE and NN has been supporting document.forms[]
since ver 4 or around

[frizzle]

Allrighty, thanks!

[J. J. Cale]

<c.**********@gmail.com> wrote in message
news:11*********************@f14g2000cwb.googlegro ups.com...

you can submit the form thru javascript. sthg like <img
src="button.gif"
onClick="javascript:document.forms['formName'].submit();">

IIRC not all UA versions support onclick on the image element.]
Jimbo

[frizzle]

Well, too bad guys, problem not solved:

Offline this works:
<input name="Reset" type="image" value="Reset" src="button.gif"
width="64" height="24">

Online it submits the form... Whyyyyyyyyyyyyyy :(
The form is in a PHP-page, but that shouldn't be the issue....

Please helpe me out on this one, i really want to keep the advantages
of a 'real' submit button instead of an image with an onClick
element....

Thanks...

[Deniz Adrian]

> Offline this works:

<input name="Reset" type="image" value="Reset" src="button.gif"
width="64" height="24">
what do you mean with "works"?
The upper code should submit the form, as a type="image" input in a form
always acts as a submit. What it never does is reset the form!

Online it submits the form... Whyyyyyyyyyyyyyy :(
The form is in a PHP-page, but that shouldn't be the issue....

If you don't want to submit it, nore reset it, simply use <img
src="image.jpg" alt="image" /> :)

best regards
deniz adrian

[Evertjan.]

frizzle wrote on 10 mrt 2005 in comp.lang.javascript:

Well, too bad guys, problem not solved:

Offline this works:
<input name="Reset" type="image" value="Reset" src="button.gif"
width="64" height="24">

<form id='q'>
<input name='x'><br>
<img src='submitbutton.gif'
onclick="document.getElementById('q').submit()">
<img src='resetbutton.gif'
onclick="document.getElementById('q').reset()">
</form>

--
Evertjan.
The Netherlands.
(Replace all crosses with dots in my emailaddress)

[frizzle]

Too bad guys, problem not solved :(

Still want to use an image-based button. I know the following works
offline:
<input name="Reset" type="image" value="Reset" src="button.gif"
width="64" height="24">

But as soon as i put it online, instead of resetting the form, it
submits the form. The page the form is in, is an PHP-generated page,
but that shouldn't be the issue.

I'd really like to find a solution for this, because i want to keep
the advantages of a 'real' button, instead of using an image with an
onClick event...

Thanks!

[Lee]

frizzle said:

Well, too bad guys, problem not solved:

Offline this works:
<input name="Reset" type="image" value="Reset" src="button.gif"
width="64" height="24">

Online it submits the form... Whyyyyyyyyyyyyyy :(
The form is in a PHP-page, but that shouldn't be the issue....

Please helpe me out on this one, i really want to keep the advantages
of a 'real' submit button instead of an image with an onClick
element....

An input of type image always submits the form.
There is no problem to solve except to find out why you want
to beat your head against this wall.

What advantages of a "real" submit button do you want to keep?

[frizzle]

Ok, consider my previous post unsent, i had some problems with the
Google Groups. Anyway, i have the problem solved, don't know why it's
all of a sudden working right, but it is.. :)

Thanks guys!