Form by-passing validation if onchange fires in drop-down.

[belcherman]

I have a form that needs to force a selection if more than one client exists in the list for the Client Drop-down. This is working properly with one issue. There are two drop-downs that have an onchange with submit the form as the action. For some reason, this is by-passing the onsubmit action that is to be done in the form declaration. I am not sure how to get this to do it. If I hit a form button, of course it does the onsubmit='return ClientSSN_Selection(this)' function. But if I select a MailType and the onchange="frmMaintain.submit() fires, it is not doing what the form should be doing when it submits, which is checking the ClientSSN Value.


FORM TAG:
<form method='POST' onsubmit='return ClientSSN_Selection(this)' language='JavaScript' name='frmMaintain' id='frmMaintain'>



ClientSSN Drop-down:
<select name="ClientSSN" onchange="frmMaintain.submit()">

MailType Drop-down:
<select name="MailType" onchange="frmMaintain.submit()">


FUNCTION:
<script Language="JavaScript" Type="text/javascript"><!--
function ClientSSN_Selection(theForm)
{

if (theForm.ClientSSN.value == 0000000000)
{
alert("Please select a client.");
theForm.ClientSSN.focus();
return (false);
}
return (true);
}
//--></script>

[siteguru]

Option 1. Remove the onchange call from the option tags, so the user HAS to click the submit button/whatever.

Option 2. Change the onchange call to refer to a function that passes theForm to ClientSSN_Selection function, checks the return value and if OK then does the submit. Something like this (UNTESTED!) ...

<select name="ClientSSN" onchange="checksubmit (this.form)">

function checksubmit (theForm) {
  if (ClientSSN_Selection (theForm)) {
    theForm.submit();
  } else {
    alert ("Must select a ClientSSN value!");
  }
}

[belcherman]

Thanks for your help. The example helped me to get this working. I ended up with this:



FORM:
<form method='POST' onsubmit='return checksubmit(this);' language='JavaScript' name='frmMaintain' id='frmMaintain'>



DROP-DOWNS:
<select name=""ClientSSN"" onchange=""checksubmit (this.form)"">
<select name=""MailType"" onchange=""checksubmit (this.form)"">



FUNCTIONS:

<script Language="JavaScript" Type="text/javascript">

function checksubmit (theForm) {
if (ClientSSN_Selection (theForm)) {
theForm.submit();
} else {
alert ("Must select a client.!");
return (false);
}
}
</script>


<script Language="JavaScript" Type="text/javascript"><!--
function ClientSSN_Selection(theForm)
{

if (theForm.ClientSSN.value == 0000000000)
{
theForm.ClientSSN.focus();
return (false);
}
return (true);
}
//--></script>

[siteguru]

You don't need to close one script block and open another ...

<script type="text/javascript">
<!--
function checksubmit (theForm) {
  if (ClientSSN_Selection (theForm)) {
    theForm.submit();
  } else {
    alert ("Must select a ClientSSN value!");
  }
}

function ClientSSN_Selection(theForm) {
  if (theForm.ClientSSN.value == 0000000000) {
    theForm.ClientSSN.focus();
    return (false);
  }
  return (true);
}
//-->
</script>