Javascript submits form twice

Discuss how to use and promote Web standards with the Mozilla Gecko engine.
Post Reply
DebbieLeigh
Posts: 11
Joined: November 3rd, 2004, 2:04 pm

Javascript submits form twice

Post by DebbieLeigh »

Hi,

I've written some javascript to stop right-clicking on the page that is displayed by my software as it is re-directing to a browser to a payment processor. However it seems to be having a weird side-effect. It took me days to narrow it down to this script, but it seems to be causing my order page form to be submitted twice when the Submit button is clicked. However, it is only happening in Firefox - it works fine in all the other browsers.

I have been scratching my head over this for a very long while, but I still can't see how this code could possibly cause a form submission, but through a lot of trial and error testing, I've found that when this code is present, the form is submitted a second time, but when it's absent, the form is submitted only once.

The process that happens is that my order page is submitted to a PHP script, which adds the order to my database and sends the dopay.php page back to the browser. This page then forwards the browser to the payment processor's page. Sometimes, it may take a few seconds to get the processor's page, so I added the js script to stop opportunists from looking at the sensitive information in the form that is submitted on the page. Obviously, the determined can always use the others ways, but as the page is only displayed for a few seconds, if that, it's very rarely there long enough to be able to use the other methods.

However, when this script is present, I get two orders being added to my database and my test display messages show that it's because my order page php script has been triggered twice.

These are the pages involved:

The dopay.php page:

Code: Select all

<DOCTYPE>
<html>
<head>
<SCRIPT></This> 1) {
         alert('Page not available');
         return false;
      }
   }
}
function funMouseClick(evt) {
   var objEvt = funGetEvent(evt);

   if (objEvt.which) {
      var button = objEvt.which;
   } else {
      var button = objEvt.button;
   }

   if (button > 1) {
      alert('Page not available');
      return false;
   }
}
if (document.captureEvents) {
   if (Event.KEYPRESS) {
      document.captureEvents(Event.KEYPRESS|Event.MOUSEDOWN|Event.CLICK);
   } else {
      document.captureEvents(1024|1|64);
   }
}
document.onkeypress  = funKeyPress;
document.onmousedown = funMouseDown;
document.onclick     = funMouseClick;

--></SCRIPT>
</head>
<body>
<form>
<input>
<input>
<input>
<input>
<input>
<input>
<input>
<input>
<input>
<input>
<input>
</form>
</body>
</html>

As you can see, the form on this page goes to Alertpay, so how on earth can my own order page be submitted twice?

The order page form:

Code: Select all

<form>
   <table>
   <tr><td>
      <fieldset><legend>Enter Your Details</legend>
      <table>
      <tr>
         <td><span>* </span>First Name:</td>
         <td>
            <input>
         </td>
      </tr>
      <tr>

         <td><span>* </span>Last Name:</td>
         <td>
            <input>
         </td>
      </tr>
      <tr>
         <td><span>* </span>Email Address:</td>

         <td>
            <input>
         </td>
      </tr>
      </table>
      <table>
      <tr><td><img src="images/spacer.gif" width="1" height="1"></td></tr>
      <tr>
         <td>

<input>
         </td>
      </tr>
      <tr><td>
         <img src="images/spacer.gif" width="1" height="5"><br>
         (It may take several moments to take you to our secure payment page, so please be patient. We always protect your privacy and never share your email address with anybody. Also, to ensure you receive our emails, we don't allow free email addresses e.g. yahoo, hotmail, msn.)
      </td></tr></table>
      </fieldset>
   </td></tr></table>
</form>

funDisable disables the image button and submits the form. I've thoroughly tested this script with Firebug and it only ever does one submit.

The order page php script is far too big and complex to include here, but all it does with the dopay.php page is to echo it back to the browser. But anyway, I've eliminated it from the equation, as my testing has all pointed to the presence of the js script on the dopay.php page.

It's an obscure one, but does anyone have any suggestions as to how the js script could be causing the order page form to be submitted a second time?

Debbie
User avatar
Dartman
Moderator
Posts: 11995
Joined: February 9th, 2006, 9:43 pm

Post by Dartman »

Moving to Web Development
Alcohol and Calculus don't mix. Never drink and derive.
User avatar
jscher2000
Posts: 11762
Joined: December 19th, 2004, 12:26 am
Location: Silicon Valley, CA USA
Contact:

Post by jscher2000 »

Take a look at the last post in this thread:

Double-submit problem in ASP shopping cart
http://forums.mozillazine.org/viewtopic.php?t=626277

Does that help?
User avatar
Kelson
Posts: 161
Joined: August 19th, 2005, 12:03 pm
Contact:

Re: Javascript submits form twice

Post by Kelson »

DebbieLeigh wrote:I added the js script to stop opportunists from looking at the sensitive information in the form that is submitted on the page. Obviously, the determined can always use the others ways, but as the page is only displayed for a few seconds, if that, it's very rarely there long enough to be able to use the other methods.


Semi-off-topic, but it's extremely simple for someone to pull up View->Page Source from the menu, or even faster, just hit Ctrl-U the moment the page loads. Blocking right-click is kind of like shutting the window, but leaving the front door open.
Can Firefox users and Opera fans agree on anything? The Alternative Browser Alliance
DebbieLeigh
Posts: 11
Joined: November 3rd, 2004, 2:04 pm

Post by DebbieLeigh »

Hi,

I've now found the solution, which is in this bug report: https://bugzilla.mozilla.org/show_bug.cgi?id=236858 (thanks jscher2000), so I thought I'd share what I did with everyone.

According to the bug report, the absence of a "content-type text/html; charset=iso-8859-1" header or <meta> meta tag in the page causes the browser to use it's default charset, which it may decide is wrong once it gets to process the actual data on the page. This is what causes the browser to re-request the page to be able to process it using the correct charset, hence submitting the form twice. Not the most desirable result, I grant you, but that how it's been designed to work, currently.

So, I tried the suggested fix and found that putting both or just the meta tag did solve the problem, but not consistently enough, because it still happened every so often.

So, I put in a bit of code to not use the javascript when the browser is Firefox, as that is the only browser in which the problem occurs.

Code: Select all

<?php
if  (USER_BROWSER_AGENT <> "FIREFOX"):
?>
<script><!--
<php>
--></script>
<php>

USER_BROWSER_AGENT is determined by this code, which I thought might be useful for anyone who doesn't already have something similar:

Code: Select all

if  (!empty($_SERVER["HTTP_USER_AGENT"])):
   define("USER_AGENT", $_SERVER["HTTP_USER_AGENT"]);
elseif (!empty($HTTP_SERVER_VARS["HTTP_USER_AGENT"])):
   define("USER_AGENT", $HTTP_SERVER_VARS["HTTP_USER_AGENT"]);
else:
   define("USER_AGENT", "");
endif;

if  (strstr(USER_AGENT, "Win")):
   define("USER_OS", "Win");
elseif (strstr(USER_AGENT, "Mac")):
   define("USER_OS", "Mac");
elseif (strstr(USER_AGENT, "Linux")):
   define("USER_OS", "Linux");
elseif (strstr(USER_AGENT, "Unix")):
   define("USER_OS", "Unix");
elseif (strstr(USER_AGENT, "OS/2")):
   define("USER_OS", "OS/2");
else:
   define("USER_OS", "Other");
endif;

if  (ereg("Opera(/| )([0-9].[0-9]{1,2})",  USER_AGENT, $aMatches)):
   define("USER_BROWSER_VER", $aMatches[2]);
   define("USER_BROWSER_AGENT", "OPERA");
elseif (ereg("MSIE ([0-9].[0-9]{1,2})",    USER_AGENT, $aMatches)):
   define("USER_BROWSER_VER", $aMatches[1]);
   define("USER_BROWSER_AGENT", "IE");
elseif (ereg("OmniWeb/([0-9].[0-9]{1,2})", USER_AGENT, $aMatches)):
   define("USER_BROWSER_VER", $aMatches[1]);
   define("USER_BROWSER_AGENT", "OMNIWEB");
elseif (ereg("(Konqueror/)(.*)(;)",        USER_AGENT, $aMatches)):
   define("USER_BROWSER_VER", $aMatches[2]);
   define("USER_BROWSER_AGENT", "KONQUEROR");
elseif (ereg("Mozilla/([0-9].[0-9]{1,2})", USER_AGENT, $aMatches)
   &&  ereg("Firefox/([0-9]*)",           USER_AGENT, $aMatches2)
      ):
   define("USER_BROWSER_VER", $aMatches[1] . "." . $aMatches2[1]);
   define("USER_BROWSER_AGENT", "FIREFOX");
elseif (ereg("Mozilla/([0-9].[0-9]{1,2})", USER_AGENT, $aMatches)
   &&  ereg("Safari/([0-9]*)",            USER_AGENT, $aMatches2)
      ):
   define("USER_BROWSER_VER", $aMatches[1] . "." . $aMatches2[1]);
   define("USER_BROWSER_AGENT", "SAFARI");
elseif (ereg("Mozilla/([0-9].[0-9]{1,2})", USER_AGENT, $aMatches)):
   define("USER_BROWSER_VER", $aMatches[1]);
   define("USER_BROWSER_AGENT", "MOZILLA");
else:
   define("USER_BROWSER_VER", 0);
   define("USER_BROWSER_AGENT", "OTHER");
endif;

Hope that helps.

Debbie
Post Reply