hi everyone
well the problem is while using image instead of button or submit input types (for my own reasons)and trying to validate some fields deciding whether to submit the form or not. The image tag sends it anyway.
I call a function to validate my fields from the onclick field in my image input tag, but it submits the form even if I leave the body of the validate function empty! how can I stop it from submiting the form?
please help
.
.
<script language="javascript">
<!--
function validate(){
if(document.form1.username=="")
 alert("empty field!");
else document.form1.submit();
}
-->
</script>
.
.
.
<form name="form1" method="post" action="/LearningJSTL-Project-context-root/Do.do;jsessionid=c6646544231ccb316b5ef1b74feba23ce d8cb5de2bbf" enctype="multipart/form-data">
<div align="center">
<input type="image" name="y" src="x" onclick="validate()"><br>
<input type="text" name="userName" value=""><br>

Hi there,

To stop the form from being submitted, you need to change the Validate function so it returns false:

if(document.form1.username=="")
{
  alert("empty field!");
  return false;
}
else
{
  return true;
}

To make this work, you need to add return to the onclick handler as well:

<input type="image" name="y" src="x" onclick="return validate();">

You don't need document.form1.submit();, because an input type="image" will cause the form to be submitted automatically when you return true from the click handler.

Cheers,

Imar
---------------------------------------
Imar Spaanjaars
Everyone is unique, except for me.

Thank you very much Imar.
do you know any ebook in which such kind of things are covered .
in my complete references SAMS' "pure javascript" and "javascript Bible Gold" by Danny Goodman I couldn't even find the Image's onclick property

In my opinion the call to validate should be in the form's onsubmit handler, you don't need to worry about onclick at all. That way it will be called whenever the form is submitted, except if it is submitted via code.

--

Joe

You can try http://www.w3schools.com/js/default.asp or http://www.javascripts.com. I also think that Beginning JavaScript (http://www.wrox.com/WileyCDA/WroxTit...764555871.html) discusses this.

I fully agree with Joe's comment. Adding the validation to the onsubmit is much cleaner, as you'll catch much more post attempts than adding the code to each button or image. You still need to use

return Validate()

though.

Cheers,

Imar
---------------------------------------
Imar Spaanjaars
Everyone is unique, except for me.

Thanks for the links, but the onsubmit is not a good idea for 2 reasons:

1.I might(and I do)need different validations depending on which image button is clicked.
2.wherever I use this.form.submit() function in href or a button handler or anywhere else, after calling it the onsubmit of the form fails to stop the form being submitted (I mean returning false won't work).It only works when you're submiting via a submit button or an image button --> <input type="submit">

Here's the code that after alerting "validation done!" submits the form anyway:

function validate(){
alert("validation done!");
return false;
}

<form name="form1" method="post" enctype="multipart/form-data" onsubmit="return validate();">

<a href="javascript:document.form1.submit(document.fo rm1);" >submit</a>

That is correct. That's why Joe said: "except if it is submitted via code."

The same problem applies when you add the code to individual buttons, though. So, onsubmit will catch more situations that separate onclick handlers.

In the end, what works is what counts. So, if you're more comfortable with adding the code to a click handler, by all means, do so.... ;)

Cheers,

Imar
---------------------------------------
Imar Spaanjaars
Everyone is unique, except for me.