1

I cannot figure out what I'm doing wrong. validateForm() does not seem to execute from an onsubmit. Here is validateForm()

function validateForm() {
    var amt = IsNumeric(document.forms["InvGenPay"]["Amount"].value);

    alert(amt);

    if (amt == false)
    {
        alert("placeholder to avoid scrolling.");
        return false;
    }
    else
    {
        return true;
    }
}

function IsNumeric(strString)
{
    //  check for valid numeric strings  
    var strValidChars = "0123456789.";
    var strChar;
    var blnResult = true;

    if (strString.length == 0) return false;

    //  test strString consists of valid characters listed above
    for (i = 0; i < strString.length && blnResult == true; i++)
    {
        strChar = strString.charAt(i);
        if (strValidChars.indexOf(strChar) == -1)
        {
            blnResult = false;
        }
    }

    if (0 > parseFloat(strString))
    {
        return false;
    }
    else
    {
        return blnResult;
    }
}

Here is the form with onsubmit:

<script type="text/javascript" language="JavaScript1.2">
document.write('<form name="InvGenPayDonation" action="'+PostURL+'" onsubmit="return validateForm();" method="POST">');
</script>


<input type='text' name='DonationAmount' value="0.00">
In honor of <span style="color: #FF0000"><br />
<input type='text' name='TransDesc' id='TransDesc' value="" >
<input type="submit" value="Next">
</form>
octopusgrabbus
  • 10,555
  • 15
  • 68
  • 131
  • 3
    Why are you writing your opening form tag with a document.write line? – j08691 Sep 12 '12 at 21:13
  • 2
    Why are you document.write the form tag? If you need to set the action, do it with code. `document.InvGenPayDonation.action = PostURL;` – epascarello Sep 12 '12 at 21:13
  • Where are you defining `PostURL`? – João Silva Sep 12 '12 at 21:13
  • Why are you `document.write`-ing your `
    `?
     – gen_Eric Sep 12 '12 at 21:13
  • 1
    Yeah, you can't actually do that with a Javascript statement, there has to be `string..." +` or a line continuation character (which I think is shabbily supported, I don't use it). Also, *please*, **please** do not do this to your page. `document.write` is horribly outdated and I suggest you should learn newer methodologies. – Jared Farrish Sep 12 '12 at 21:14
  • I'm writing it to form an outgoing URL based on an incoming URL. It's a form of web routing we use. The form works, but the onsubmit does not. – octopusgrabbus Sep 12 '12 at 21:14
  • `method=POST` should be `method="POST"`. – gen_Eric Sep 12 '12 at 21:15
  • This has nothing to do with "it works". It's severely out of date (no offense). There's so many better, more adaptable and "robust" ways of doing this. I'd also say, some are kinda fun. – Jared Farrish Sep 12 '12 at 21:20
  • @Rocket not in HTML5 - quotes are optional if the value has no whitespace or equals signs. – Pointy Sep 12 '12 at 21:20
  • I've edited the OP to take into account these comments. I'd prefer to remove the document.write and assign the action directly. – octopusgrabbus Sep 12 '12 at 21:22
  • 1
    See [`element.addEventListener`](https://developer.mozilla.org/en-US/docs/DOM/element.addEventListener) (`window.attachEvent` on IE8 and lower). Consider this an intervention. `:D` – Jared Farrish Sep 12 '12 at 21:23

2 Answers2

3

Your biggest issue is that you don't have the right form name (or the right field name for that matter) in your validation code. 

var amt = IsNumeric(document.forms["InvGenPay"]["Amount"].value);

vs

'<form name="InvGenPayDonation" action="'+PostURL+'"

Full, working code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"         
   "http://www.w3.org/TR/html4/strict.dtd">
<head>
  <title>Sampe file</title>

  <script>
function validateForm() {
    // Badly named variable, since this is actually a boolean of 'IsNumeric'
    var amt = IsNumeric(document.forms["InvGenPayDonation"]["DonationAmount"].value);


    // Can be simplified as simply:
    //return amt;
    alert('Amt = ' + amt);

    if (!amt)
    {
        alert("placeholder to avoid scrolling.");
        return false;
    }
    else
    {
        return true;
    }
}

function IsNumeric(n) {
  // Shamelessly stolen from: 
  // http://stackoverflow.com/questions/18082/validate-numbers-in-javascript-isnumeric
  return !isNaN(parseFloat(n)) && isFinite(n);
}

</script>

<body>
<form name="InvGenPayDonation" action="#"
        onsubmit="return validateForm();" 
        method=POST>


<input type='text' name='DonationAmount' value="0.00">
In honor of <span style="color: #FF0000"><br />
<input type='text' name='TransDesc' id='TransDesc' value="" >
<input type="submit" value="Next">

<script>
  // Assigned for testing purposes
  var  PostURL = "#"
  document.forms.InvGenPayDonation.action = PostURL;
</script>
</form>
</body>
</html>
Jeremy J Starcher
  • 23,369
  • 6
  • 54
  • 74
2

You cannot have un-escaped newlines in a JavaScript string. Check your JavaScript console, you are probably getting a syntax error. That error is why the onsubmit is not running.

Also, as suggested, do not use document.write, just write the form normally in HTML, and use JavaScript to add just the POST url.

<form name="InvGenPayDonation" onsubmit="return validateForm();" method="POST">
    <input type='text' name='DonationAmount' value="0.00">
    In honor of <span style="color: #FF0000"><br />
    <input type='text' name='TransDesc' id='TransDesc' value="" >
    <input type="submit" value="Next">
</form>

<script type="text/javascript">
    document.forms.InvGenPayDonation.action = PostURL;
</script>

P.S. As Jeremy J Starcher pointed out, your form name is wrong inside validateForm.

Community
  • 1
  • 1
gen_Eric
  • 223,194
  • 41
  • 299
  • 337