Form Submit with Image as a Submit Button

[scripter73]

Hi,

This seems like a relatively simple question, but I still don’t know the answer.

Here’s my goal:
Submit my HTML form with a customized submit button that is an image. Before submitting, however, I want to perform a Javascript function that verifies a form field (for blankness, etc.) It’s important to execute that JS.

Here’s what I have. I have 2 buttons that I am comparing side by side. I only need one and I'm trying to figure out the best one to use:

1) <img type=”image” src=”images/submitButton.gif” width=70 height=20 onlick=”document.Entry.submit();”><br><br>
Problem here is this doesn’t execute the way I want by calling the function, it just submits form no matter what, but it looks good.

2) <input type=”image” name=”Submit” value=”Submit” src=”images/submitButton.gif” width=70 height=20><br><br>
It executes exactly the way I want, but the problem is the image is distorted (bigger than the other one) even though it’s the same graphic. When it’s clicked, the onsubmit in the <form> executes properly.

I don’t know how I can merge the “behavior” and “look” of these two buttons into one.

Here is my entire form:


<form name=&quot;AcctEntry&quot; action=&quot;Status.html&quot; method=&quot;post&quot; onsubmit=&quot;return verify(this);&quot;>
<input name=&quot;AcctNumber&quot; type=&quot;text&quot; size=&quot;20&quot; maxlength=&quot;20&quot;><br><br>
<img type=&quot;image&quot; src=&quot;images/submitButton.gif&quot; alt=&quot;submit&quot; width=&quot;69&quot; height=&quot;17&quot; border=&quot;0&quot; onclick=&quot;document.AcctEntry.submit();&quot;> Button1
<input type=&quot;image&quot; name=&quot;Submit&quot; value=&quot;Submit&quot; src=&quot;images/submitButton.gif&quot;><br><br> Button2

</form>



Please help.

Any help is appreciated.

Thanks,
Scripter73



Change Your Thinking, Change Your Life.

 

[dwarfthrower]

<img type=”image” src=”images/submitButton.gif” width=70 height=20 onlick=”verify(this.form)?document.Entry.submit():return false;”>

_{Never be afraid to share your dreams with the world.
There's nothing the world loves more than the taste of really sweet dreams.}

 

[scripter73]

Thanks for replying, dwarfthrower. It seems when I put that into my code in place of the other images, when I click on the submit image, it hangs and doesn't go anywhere, but I see what you're trying to tell me. Let me work on it a little and I'll let you know what I find.

Thanks for your sample.

scripter73


Change Your Thinking, Change Your Life.