Checking if input has a int in it Javascript

Question

I am working on a HTML page and can't seem to figure out how to check if the user input has an integer in it. I have tried parseInt, userInput.charAt(i) in a for loop, isNaN. Nothing seems to be working.

This is my HTML

<label for="author" id="author">Favorite Book Author: </label>
<input type="text" name="author" id="authorText">

This is my JavaScript

function checkAuthor(){
    var userInput = $("authorText").value;
    for(var i = 0; i < userInput.length; i++)
    {
        if(userInput.charAt(i) <= 0 || userInput.charAt(i) > 0)
        {
            addError("There is a number in 'Favorite Book Author' input");
            return false;
        }
        else
            return true;
    }
}

I need to see if there is any integer that was entered by the user. If the input was "Mark5", "Ma5rk", "5", I need it to catch that 5 and display an error. Is there anyway that will work? I have a feeling that the .charAt is not working because it is recognizing the ints as strings, but I have tried to do a parseInt of every single

var x = parseInt(userInput.charAt(i));

inside the for loop, and then compared x inside the if statements. But nothing seemed to work

The addError function is this

function addError(text){
    var mylist = window.document.createElement("li");
    var myText = window.document.createTextNode(text);
    mylist.appendChild(myText);
    window.document.getElementByTagName("ul")[0].appendChild(mylist);
}

You have a typo mistake while reading the input value. Use $("#authorText").value; — Pankaj Kumar Singh, Feb 28 '17 at 06:25
this is possible but do you only care about numbers? Other non-alphabetic inputs exist — Peter G, Feb 28 '17 at 06:26
Possible duplicate of [Check whether an input string contains number](http://stackoverflow.com/questions/5778020/check-whether-an-input-string-contains-number) — mvermand, Feb 28 '17 at 06:26
I don't care about anything, only checking to see if the input has a integer in it. I won't be doing anything with the input later on. — Programmer, Feb 28 '17 at 06:27

score 0 · Answer 1 · answered Feb 28 '17 at 06:26

0

You can use regular expression to search that.

var userInput = $("authorText").value;
if (userInput.search(/[^a-zA-Z]+/)) {
  addError("There is a number in 'Favorite Book Author' input");
return false.
}

answered Feb 28 '17 at 06:26

Rakesh Yadav

113
7

For some reason it still entered the if statement even if i enter a string without integers in the HTML – Programmer Feb 28 '17 at 06:35
Can you share your complete block of code where you have used regex ? – Rakesh Yadav Feb 28 '17 at 06:40
What is regex? Never heard of that word – Programmer Feb 28 '17 at 06:42
Regular Expression, like i used in my sample code /[^a-zA-Z]+/ – Rakesh Yadav Feb 28 '17 at 07:05

Chien_Khmt · Accepted Answer · 2017-02-28T06:42:16.570

0

You should check whether the char code between 48 and 57

function checkAuthor(){
    var userInput = $("authorText").value;
    for(var i = 0; i < userInput.length; i++)
    {
        var c = userInput.charAt(i).charCodeAt(0);
        if(c <= 57 && c >= 48)
        {
            addError("There is a number in 'Favorite Book Author' input");
            return false;
        }
           
    }
     return true;

}

edited Feb 28 '17 at 06:42

answered Feb 28 '17 at 06:27

Chien_Khmt

257
2
8

RegEx is meant for using in scenarios like this. Then why you put overload in code? – Sagar V Feb 28 '17 at 06:39
I get an error "Uncaught ReferenceError: charCodeAt is not defined" when I tried this – Programmer Feb 28 '17 at 06:41
Ok I just fix the function, please try again – Chien_Khmt Feb 28 '17 at 06:42
He just want to check whether the string does include the int value or not, that's mean he allows the rest characters not only abc – Chien_Khmt Feb 28 '17 at 06:44
yes. check 2 answers one by me and one from @gyre. You can see the use of regex – Sagar V Feb 28 '17 at 06:45
Right now it works, but only if I type in a integer. But if I have a int inside of a string like "Ma5rk" it doesn't enter the if statement – Programmer Feb 28 '17 at 06:50
Yes I know that using the regrex is better, but I just base on his source code to optimize – Chien_Khmt Feb 28 '17 at 06:55
@Programmer: I just check still work correctly then return false – Chien_Khmt Feb 28 '17 at 06:59

Sagar V · Answer 3 · 2017-02-28T06:35:58.070

jQuery and JavaScript is not Same.
You can't use value in a $() returned. instead use val() and also use # to use an ID as selector. use [0-9] to check whether a number is present or not.

function checkAuthor(){
    var userInput = $("#authorText").val(); // add # to get ID and val()
    var result = /[0-9]+/.test(userInput);
    result?alert("false"):void(0);
    console.clear();
    console.log(!result);
    return !result;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<label for="author" id="author">Favorite Book Author: </label>
<input type="text" name="author" id="authorText" onblur="checkAuthor();" />

Isaac B · Answer 4 · 2017-02-28T07:16:28.223

0

Since your looking for a single number, a RejExp test will likely be the easiest/cleanest method.

JQuery

function checkAuthor(){
    var userInput = $("#authorText").val();

    // check whether any char in userInput is a number. yes: true. no: false
    if(/[0-9]/.test(userInput)) {
        addError("There is a number in 'Favorite Book Author' input");
        return false;
    } else
        return true;
    }
}

function addError(text){
    var mylist = window.document.createElement("li");
    var myText = window.document.createTextNode(text);
    mylist.appendChild(myText);
    window.document.getElementByTagName("ul")[0].appendChild(mylist);
}

Vanilla JS

function checkAuthor(){
    var userInput = document.getElementById('#authorText').value;

    // check whether any char in userInput is a number. yes: true. no: false
    if(/[0-9]/.test(userInput)) {
        addError("There is a number in 'Favorite Book Author' input");
        return false;
    } else
        return true;
    }
}

function addError(text){
    var mylist = window.document.createElement("li");
    var myText = window.document.createTextNode(text);
    mylist.appendChild(myText);
    window.document.getElementByTagName("ul")[0].appendChild(mylist);
}

edited Feb 28 '17 at 07:16

answered Feb 28 '17 at 06:35

Isaac B

695
1
11
20

.value?? what you actually mean with that in jQuery? – Sagar V Feb 28 '17 at 06:36
also define `addError` – Sagar V Feb 28 '17 at 06:36
Thanks on the .val(), I actually saw these comments after editing my message. I assume the addError function is defined elsewhere in the code and not related to the question. – Isaac B Feb 28 '17 at 06:43
I added the addError function – Programmer Feb 28 '17 at 06:45
I just threw it in since it's in the question now. – Isaac B Feb 28 '17 at 07:16

Checking if input has a int in it Javascript

4 Answers4