Home/ Questions/Q 3498210
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-18T12:27:45+00:00

I am trying to validate the form input but my validation is not working.

  • 0

I am trying to validate the form input but my validation is not working.
The string must have at least one letter or digit,
an integer should be between 0-11 and should pick at least one fruit.
But even if i dont enter any input,
it just go to the input_ok.html file.
It needs to pop-up the error window.

Here is my code:

function validateInput() {
    var str = myForm.inputString.value;
    var nbrStr = myForm.inputInteger.value;
    var nbr = parseInt(nbrStr);
    var fruit = myForm.fruit.value;
    if (str != "" && nbrStr != "" && fruit != "" && !isNaN(nbr) && nbr < 11) {
        return true;
    } else {
        var msg = "";
        var strError = false;
        if (str == "") {
            msg += "\nPlease enter a string with at least one letter or digit";
            strError = true;
        }
        if (nbrStr == "") {
            msg += "\nPlease enter  an integer in the range 0-11";
        } else if (isNaN(nbr)) {
            msg += "\nPlease enter an integer";
        } else if (nbr > 11) {
            msg += "\nPlease enter an integer less than 11";
        }
        if (strError) {
            myForm.inputString.focus();
        } else {
            myForm.inputInteger.focus();
        }
        alert(msg);
    }
    return false;
}

<body>
    <h1>Week 08, Exercise 01</h1>
    <form action="week08_01servlet" 
          method="post" 
          name="myForm" 
          onsubmit="return validateInput();">
        <p>Please enter the following information, 
        and then click the submit button.</p>
        <p class="indent">A string with at least one letter or digit
            <input type="text" name="inputString">
            <br>An integer in the range 0-11
            <input type="text" name="inputInteger">
            <br>Pick a fruit <select name="fruit">
                <option value="---">---
                <option value="apple">apple
                <option value="banana">banana
                <option value="cherry">cherry
                <option value="pear">pear
            </select></p>
        <p><input type="submit" value="Submit"></p>
        <input type="hidden" name="command" value="do_it">
    </form>
</body>

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    This is clearly homework, but I beleave every question deservers an answer. Valid xhtml5, javascript checked with jslint and compressed with ajaxmin. Enjoy.

    Also, you might want to read ppks Introduction to Forms.

    <!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>Week 08, Exercise 01</title>
    <link rel="stylesheet" href="Week08_01.css">
    <script>
    function validateInput(c){var f=c.inputString.value,d=c.inputInteger.value,b=parseInt(d,10),g=c.fruit.value;if(f!==""&&d!==""&&g!==""&&!isNaN(b)&&b>=0&&b<11)return true;else{var a="",e=false;if(f===""){a+="\nPlease enter a string with at least one letter or digit";e=true}if(d==="")a+="\nPlease enter  an integer in the range 0-11";else if(isNaN(b))a+="\nPlease enter an integer";else if(b<=0)a+="\nPlease enter a positive integer";else if(b>11)a+="\nPlease enter an integer less than 11";if(e)c.inputString.focus();else c.inputInteger.focus();alert(a);return false}}
    </script>
</head>
<body>
    <h1>Week 08, Exercise 01</h1>
    <form action="week08_01servlet" 
        method="post" 
        name="myForm"
        onsubmit="return validateInput(this);">
        <p>Please enter the following information, 
        and then click the submit button.</p>
        <p class="indent">A string with at least one letter or digit
            <input type="text" name="inputString" />
            <br>An integer in the range 0-11
            <input type="text" name="inputInteger" />
            <br />Pick a fruit <select name="fruit">
                <option value="---">---</option>
                <option value="apple">apple</option>
                <option value="banana">banana</option>
                <option value="cherry">cherry</option>
                <option value="pear">pear</option>
            </select></p>
        <p><input type="submit" value="Submit">
        <input type="hidden" name="command" value="do_it"></p>
    </form>
</body>
</html>
    • 0