title: Javascript two submit buttons in one form almost complete
body: <p>I have a form with two submit buttons with onClick events attached. The form action is a paypal form.</p>
  
  <p>If make a payment button is pressed the form is emailed and then redirects to paypal for payment.</p>
  
  <p>If the invoice button is pressed an email is sent with the form details but the default action of redirecting  to PayPal is stopped.</p>
  
  <p>It all seems to work fine but when the invoice buttin is pressed it still redirects to paypal.</p>
  
  <p>If the invoice button is pressed i want it to send the email but then stop and not continue on with the form action. </p>
  
  <pre><code>&lt;form action="https://www.paypal.com/cgi-bin/webscr" method="post" id="paymentform" name="paymentform"&gt;
  &lt;input type="hidden" name="cmd" value="_xclick"&gt;
  &lt;input type="hidden" name="currency_code" value="GBP"&gt;
  &lt;fieldset id="your_details" class=""&gt;
   &lt;legend&gt;Your Details&lt;/legend&gt;
   &lt;ol&gt;
    &lt;li&gt;&lt;label for="your_name"&gt;Your Name&lt;/label&gt;&lt;input type="text" name="your_name" value="" id="your_name" class="large "&gt;&lt;/li&gt;
    &lt;li&gt;&lt;label for="your_position"&gt;Your Position&lt;/label&gt;&lt;input type="text" name="your_position" value="" id="your_position" class="large"&gt;&lt;/li&gt;
    &lt;li&gt;&lt;label for="your_company"&gt;Your Company&lt;/label&gt;&lt;input type="text" name="your_company" value="" id="your_company" class="large "&gt;&lt;/li&gt;
    &lt;li&gt;&lt;label for="your_telephone"&gt;Your Telephone&lt;/label&gt;&lt;input type="text" name="your_telephone" value="" id="your_telephone" class="medium "&gt;&lt;/li&gt;
    &lt;li&gt;&lt;label for="your_mobile"&gt;Your Mobile&lt;/label&gt;&lt;input type="text" name="your_mobile" value="" id="your_mobile" class="medium"&gt;&lt;/li&gt;
   &lt;/ol&gt;
  &lt;/fieldset&gt;
  &lt;input type="submit" value="Pay by Credit Card &amp;rarr;" id="cc" onclick="return email_me(document.paymentform);" class="submit_button"&gt;
  &lt;input type="submit" value="Pay by Invoice &amp;rarr;" id="invoice" class="submit_button" onclick="return email_me(document.paymentform,true);"&gt;
  </code></pre>
  
  <p></p>
  
  <pre><code>var xmlHttp;
  var formname;
  var invoiceonly_var
  function email_me(Form,invoiceonly)
  {
      formname = Form.name;
      var params = "";
      var i;
      var Element;
      var type;
      var name;
      var fieldvalue;
      var optional;
      var BadFields = "";
      var Title;
      var Titles = new Array();
      Titles['item_name'] = "Course Title";
      var outMessage = "";
      invoiceonly_var = invoiceonly;
  
      //alert(formname);
  
      //alert(Form.length);
  
      var Optional = new Array();
  
      // optional fields
  
      Optional['your_position'] = true;
      Optional['your_mobile'] = true; 
  
      for(i = 0; i &lt; Form.length; i++)
      {
          Element = Form.elements[i];
  
          type = Element.type;
          name = Element.name;
  
          //alert("name:"+name+" type:"+type);
  
  
          if(type == "text")
          {
              fieldvalue = Element.value;
              params = params + name + "=" + fieldvalue + "&amp;";
  
              optional = Optional[name];
              if ( (fieldvalue == '' || fieldvalue == name ) &amp;&amp; typeof(optional) == "undefined")
              {
                  Title = getTitle(name,Titles);
                  BadFields += "- " + Title + "\n";
              }   
  
              //alert(params);
          }
          if(type == "textarea")
          {
              fieldvalue = Element.value;
              params = params + name + "=" + fieldvalue + "&amp;";
  
              optional = Optional[name];
              if ( (fieldvalue == '' || fieldvalue == name ) &amp;&amp; typeof(optional) == "undefined")
              {
                  Title = getTitle(name,Titles);
                  BadFields += "- " + Title + "\n";
              }   
  
              //alert(params);
          }
      }
  
  
      if(BadFields)
      {
          outMessage = "We are unable to proceed as the following \n";
          outMessage += "required fields have not been completed:\n\n";
          outMessage += BadFields;
  
          alert(outMessage);
          return false;
      }
  
      //alert(params);
  
      xmlHttp=GetXmlHttpObject();
  
      if (xmlHttp==null)
      {
          alert ("Browser does not support HTTP Request");
          return;
      }
  
      url="/payment/ajax_email_me.php?";
      if (invoiceonly_var == true)
      {
          params = params + "Payment_Method=Invoice";
      }
      else
      {
          params = params + "Payment_Method=PayPal&amp;";
      }
      url=url+params;
  
      //alert(url);
  
      xmlHttp.onreadystatechange = Finished;
  
      xmlHttp.open("GET",url,true)
  
      xmlHttp.send(null)
  
      return true;
  }
  
  function Finished() 
  { 
      if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete")
      { 
          //document.getElementById('search').innerHTML = xmlHttp.responseText;
          var response = xmlHttp.responseText;
  
          //alert(response);
          if (invoiceonly_var == true)
          {
              alert("Thank you. Your message has been sent.");
          }
          else
          {
              document.paymentform.submit();
          }
  
          document.body.innerHTML = document.body.innerHTML + "&lt;span&gt;&lt;/span&gt;";
      }
  }
  
  function GetXmlHttpObject()
  {
      var xmlHttp=null;
  
      try
      {
          // Firefox, Opera 8.0+, Safari
          xmlHttp=new XMLHttpRequest();
          //  alert("Mozilla");
      }
      catch (e)
      {
          //Internet Explorer
          try
          {
              xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
              //  alert("IE");
          }
          catch (e)
          {
              xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
              //  alert("IEError");
          }
      }
  
      return xmlHttp;
  }
  
  function selectval(Sel)
  {
      return Sel.options[Sel.selectedIndex].value;
  }
  
  function getTitle(name,Titles)
  {
      Title = Titles[name];
      if (typeof(Title) == "undefined")
      {
          Title = name;
          Title = Title.replace(/_/g," ");
      }
      return Title;
  }
  </code></pre>