Button to call JS

[fmrock]

I used to have a function call on a regular submit button, but changed it to a image type, but the call does not appear to work anymore.

It just seems to submit right though when it should not.




<input type="image" name="No Addendum Required" class="Addendum_btn" src="images/buttons/no_addendum_required.png" alt="No Addendum" width="100" height="100" border="0" onClick="return validateNoAddendumRequired()">


here is the JS function



function validateNoAddendumRequired() {
var ta = frmAddendum.elements["Addendum"];
clearComments(document.frmAddendum.Addendum);

if (!ta.value.length) {
//alert("You must enter your text or choose No Addendum Required.");
return true;
}
else
{
return (confirm("You have chosen to enter a comment. This will not become part of the medical record."));
}
}


Here is the previous button code.




<input name="btnSubmit" type="submit" id="btnSubmit" class="button" value="No Addendum Required" onClick="return validateNoAddendumRequired()">

[clueful]

Use the onsubmit event:

<form ........... onsubmit="return validateNoAddendumRequired()">

[fmrock]

I have 3 buttons on this form, and 2 of them need to perform different validation.

Any ideas on how i Can fix this? Do i need on validation function that is run onSubmit? But is there a way to tell which button is clicked?





<form action="page.asp" method="post" name="frmAddendum">


<textarea name="Addendum" cols="47" rows="10" onClick="clearComments(document.frmAddendum.Addendum)"><%=Addendum%></textarea>
<table>
<tr>
<td><input type="image" name="No_Addendum_Required" class="Addendum_btn" src="images/buttons/no_addendum_required.png" alt="No Addendum" width="100" height="100" border="0" onClick="return validateNoAddendumRequired()"></td>
<td><input type="image" name="Save_Complete_Later" class="Addendum_btn" src="images/buttons/save_addendum_complete_later.png" alt="Save Addendum for Later" width="100" height="100" border="0"></td>
<td><input type="image" name="Electronic_Signature" class="Addendum_btn" src="images/buttons/save_addendum_signature.png" alt="Save and Sign" width="100" height="100" border="0" onClick="return validateElectronicSignature()"></td>
</tr>
</table>
</form>






function validateElectronicSignature() {
var ta = document.frmAddendum.elements["Addendum"];
clearComments(document.frmAddendum.Addendum);

if (!ta.value.length) {
alert("You must enter your text or choose No Addendum Required.");
return false;
}
return (confirm("By signing this addendum your statements will become part of the medical record."));
}


function validateNoAddendumRequired() {
var ta = document.frmAddendum.elements["Addendum"];
clearComments(document.frmAddendum.Addendum);

if (!ta.value.length) {
//alert("You must enter your text or choose No Addendum Required.");
return true;
}
else
{
return (confirm("You have chosen to enter a comment. This will not become part of the medical record."));
}
}

[fmrock]

Or would it be better to add the form submit to my existing functions, and just make the images links that call the JS i want to run?