onclick always submits forms

[jjanes0918]

I have a form which does not have a submit button. I use an image with an onclick call

The onclick calls a validation script which validates fields and then if all things are ok the last thing the validation function does is submit the form if it does not pass all the tests then the script is not supposed to submit the form, alert messages are shown the form values remain and the user can make changes and revalidate and hopefully this time it submits.

Here is my code

<script language="JavaScript" type="text/javascript">

function jeff1() {
var	cc = document.getElementById('ccnum').value;
var	email = document.getElementById('email').value;

var ccnum_reg = /^\d*$/
var email_reg = /^[A-Za-z0-9._%+-]+@[A-Za-z0-9.-]+\.[A-Za-z]{2,4}$/

var sum = 0;
var i;
var badform = 0;
var val;

/////////////////////all digits
	if(!ccnum_reg.test(cc)) {
		badform=1;
		alert("Tarjeta de crédito debe estar compuesto de todos los dígitos");
	}
////////////////////////////////

///////////////////Credit card check
	for (i = cc.length - 2; i >= 0; i -= 2) {
	   sum += Array (0, 2, 4, 6, 8, 1, 3, 5, 7, 9) [parseInt (cc.charAt (i), 10)];
	}
	for (i = cc.length - 1; i >= 0; i -= 2) {
	   sum += parseInt (cc.charAt (i), 10);
	}
	val=sum % 10;
	  
	if(val != 0) {
		badform=1;
		alert("Número de la Tarjeta no valida");
	}
/////////////////////////////////////
/////////////////valid looking email check
	if(!email_reg.test(email)) {
		badform=1;
		alert("Correo electrónico no parece ser válido");
	}
/////////////////////////////////////
	alert (badform);
	if(badform*1 > 0) {
		alert("FORM NOT SENT");
	}
	else {
		document.JoinForm.submit();
	}
}
	
</script>


<?php

//	if($_POST['sub'] !=  "done") {
		echo '<form action="test123a.php" name="JoinForm" method="POST">
		CC <input name="ccnum" id="ccnum" type="text" size=16 value="'.$_POST['ccnum'].'"/><BR />
		EMAIL <input name="email" id="email" type="text" size=16 value="'.$_POST['email'].'"/>
		<input name="sub" type="hidden" value="done" />
		<input name="" type="image" src="images/blu_button.gif" onClick="javascript: jeff1(); "/>
		</form>';
//	

?>

I have been playing with the value of badform to see if that was the problem but rest assured when the any errors are detected badform goes to 1 and the form should not submit I thought it may be in my iff statement so I played with the the comparison technique

But the alert for badform always shows 1 with any error and 0 with all successes

I was trying things like

if(!badword) {


if(badword != false)


etc.

I could see this submitting if it were on a submit element in a form and if the function returns as TRUE the form submits but on an image tag where the script itselfis when does the submitting is mystifying me.

Please let me know what the answer is

[astupidname]

An input of type "image" is a submit button by default. Returning either true or false in the onclick will affect whether or not it submits. So instead of 'onclick="javascript: jeff1();"' make that: onclick="return jeff1();" and then have jeff1 either return true or false depending on issues being ok or not.

[jjanes0918]

Here is the new relevent portion of the code and it still acts the same way
I might be getting tired of looking at this but with this code I never even see the alert for badform appear I assume that even though it appears right before the return command i would think processing stops until I click OK on the alert then it send the return.

This makes sense but it still is not working anything else

	if(val != 0) {
		badform=1;
		alert("Número de la Tarjeta no valida");
	}
/////////////////////////////////////
/////////////////valid looking email check
	if(!email_reg.test(email)) {
		badform=1;
		alert("Correo electrónico no parece ser válido");
	}
/////////////////////////////////////
	alert(badform);
	if(badform)
		return false;
	else
		return true;
}
	
</script>


<?php

//	if($_POST['sub'] !=  "done") {
		echo '<form action="test123a.php" name="JoinForm" method="POST">
		CC <input name="ccnum" id="ccnum" type="text" size=16 value="'.$_POST['ccnum'].'"/><BR />
		EMAIL <input name="email" id="email" type="text" size=16 value="'.$_POST['email'].'"/>
		<input name="sub" type="hidden" value="done" />
		<input name="" type="image" src="images/blu_button.gif" onClick="javascript: return jeff1();"/>
		</form>';
//	}