-4

when user clicks the button I want to check if user entered an integer value in the box above. If false show alert message, if true go to next page. What am I missing, it seems so simple...

<html>
<body>

 <script type="text/javascript">

   function checkInteger() {
        var userData = document.getElementById("userInput");
if((typeof(userData)=='number') && (myNum.toString().indexOf('.')==-1)) {
 return true;
      }
        else {

            alert("Error!");
            return false;
         }
    }
 </script>

 <form action="page2.html" enctype="multipart/form-data" onsubmit="return checkInteger()">
 <input type="text" id="userInput"> Enter number here </input>
<br><br><br>
    <input type="submit" value = "Test" />
</form>
<br>

 </body>
</html>

Thanks! :)

  • Are you getting any error message? Is the `alert("Error!")` triggering? –  Jan 23 '15 at 11:43
  • possible duplicate of [How can I write a function that checks to see if an input is actually an integer? (Javascript)](http://stackoverflow.com/questions/21370606/how-can-i-write-a-function-that-checks-to-see-if-an-input-is-actually-an-integer) – BiscuitBaker Jan 23 '15 at 11:43
  • you can use `isNaN` method of javascript to check whether a passed value is a number or not. – Mohit Pandey Jan 23 '15 at 11:43
  • Yes i get error message whatever I enter... – Rajesh Muntari Jan 23 '15 at 11:54
  • possible duplicate of [How to check if a variable is an integer in Javascript?](http://stackoverflow.com/questions/14636536/how-to-check-if-a-variable-is-an-integer-in-javascript) – freeDom- Jan 23 '15 at 11:54

5 Answers5

1

Firstly, dont return the function in form tag. Remove the onsubmit attribute completely.

Instead assign a class to the input element for e.g "checknum"

<html>
<body>

<script type="text/javascript">

$(".checknum").keydown(function (e) {
        // Allow ctrl+A
    if ((e.keyCode == 65 && e.ctrlKey === true) || 
             // Allow: home, end, left, right, down, up and //Allow delete, backspace, tab
            (e.keyCode >= 35 && e.keyCode <= 40) || e.keyCode==46 || e.keyCode==8 || e.keyCode==9) {
                 // let it happen, don't do anything
                 return;
        }
   // Ensure that it is a number and stop the keypress
    if ((e.shiftKey || (e.keyCode < 48 || e.keyCode > 57)) && (e.keyCode < 96 || e.keyCode > 105)) {
        e.preventDefault();
    }        
  });


</script>


 <form action="page2.html" enctype="multipart/form-data">
 <input type="text" id="userInput" class="checknum"> Enter number here </input>
<br><br><br>
 <input type="submit" value = "Test" />

</form>

</body>
</html>

Function Courtesy: Someone answered this on same site which I used.

rkatkam
  • 2,634
  • 3
  • 18
  • 29
1

You can use the === operator as shown below to check if something is an integer.

if (data === parseInt(data, 10))
    alert("data is integer")
else
    alert("data is not an integer")
freeDom-
  • 362
  • 4
  • 20
1

here is the solution. You are missing .value with text field attribute

<html>
<body>

 <script type="text/javascript">

  function checkInteger() {
       var userData = document.getElementById("userInput").value;
if(!isNaN(parseInt(userData))) {
 return true;
   }
     else {

        alert("Error!");
        return false;
     }
}
</script>

<form action="page2.html" enctype="multipart/form-data" onsubmit="return     checkInteger()">
 <input type="text" id="userInput"> Enter number here </input>
 <br><br><br>
  <input type="submit" value = "Test" />
</form>
 <br>

 </body>
 </html>
Rahul
  • 5,594
  • 7
  • 38
  • 92
1
<html>
  <head>
    <script data-require="jquery@2.1.3" data-semver="2.1.3" src="https://code.jquery.com/jquery-2.1.3.min.js"></script>
    <script type="text/javascript">
      var check = function(){
        if($.isNumeric($('#userInput').val()))
          alert('ok');
        else
          alert('not okay');
      }     
   </script>
  </head>
  <body>
    <form>
      <input type="text" id="userInput" />
      <button id="sub" onclick="check()" value="Test">test</button>
    </form>
  </body>
</html>

Try this code .. there are lot of inbuilt functions in Jquery

Pranav Raj S
  • 86
  • 1
  • 2
  • 8
0

You could create two functions. One to basically process each character of the string and the other to check if that character is numeric or not. I have included an example that I have tested in my code in another use.

// Validation functions
// Checks if argument is numeric or not
function isNumeric(n)
{
    if (!isNaN(n))
    {
        return true;
    }
    else
    {
        return false;
    }
}

// Checks if argument contains any numeric characters or not
function hasNumber(s)
{
    for (var i = 0; i < s.length; i++)
    {
        var n = s.charAt(i);
        if (isNumeric(n))
        {
            return true;
        }
    }
    return false;
}
Tyler Lazenby
  • 409
  • 5
  • 27