jQuery Regular Expression Checking User Input for Numbers

I'm trying to have it so when a user enters a string in the txtNmr field, they get an output saying enter a number. Currently, what I have isn't working correctly, and I can't get anything to print out. I know there are other ways in doing, but I want to use a regular expression.

 function greetMe() 
 $("#errors").css("background-color", "white");
 var name = document.getElementById("txtName").value;
 var nr = document.getElementById("txtNmr").value;
 $("#errors").empty();
 $("#greetings").empty();
 
 found_position = txtNmr.search(/d/);
 if (found_position = -1)
 $("#errors").append("Enter a number not a string");
 $("#errors").css("background-color", "yellow");
 
 
if (nr > 0 && nr < 21) 
 for (var counter = 0; counter < nr; counter = counter + 1) 
 $("#greetings").append("Hello, " + name + "<br />");
 
 else 
 $("#errors").append("Please Enter A Number Between 1 and 20");
 $("#errors").css("background-color", "yellow");

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p>Type in your name</p>
<input type="text" id="txtName">
<p>Enter a number 1-20.</p>
<input type="text" id="txtNmr">
<input type="button" value="Greet Me!" onclick="greetMe()">
<hr>
<div id="greetings">
 <!-- Section to output the greeting -->
</div>
<div id="errors">
 <!-- Section to output the greeting -->
</div>

edited Nov 12 '18 at 2:51

Poul Bak

5,43331132

asked Nov 11 '18 at 20:12

user10636563

133

To check if a string matches a regular expression, you can use txtNmr.match(/d/) or you can use /d/.test(txtNmr) (which will return true/false depending on if the string matches regex)
– jacob.mccrumb
Nov 11 '18 at 20:24

add a comment |

 function greetMe() 
 $("#errors").css("background-color", "white");
 var name = document.getElementById("txtName").value;
 var nr = document.getElementById("txtNmr").value;
 $("#errors").empty();
 $("#greetings").empty();
 
 found_position = txtNmr.search(/d/);
 if (found_position = -1)
 $("#errors").append("Enter a number not a string");
 $("#errors").css("background-color", "yellow");
 
 
if (nr > 0 && nr < 21) 
 for (var counter = 0; counter < nr; counter = counter + 1) 
 $("#greetings").append("Hello, " + name + "<br />");
 
 else 
 $("#errors").append("Please Enter A Number Between 1 and 20");
 $("#errors").css("background-color", "yellow");

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p>Type in your name</p>
<input type="text" id="txtName">
<p>Enter a number 1-20.</p>
<input type="text" id="txtNmr">
<input type="button" value="Greet Me!" onclick="greetMe()">
<hr>
<div id="greetings">
 <!-- Section to output the greeting -->
</div>
<div id="errors">
 <!-- Section to output the greeting -->
</div>

edited Nov 12 '18 at 2:51

Poul Bak

5,43331132

asked Nov 11 '18 at 20:12

user10636563

133

To check if a string matches a regular expression, you can use txtNmr.match(/d/) or you can use /d/.test(txtNmr) (which will return true/false depending on if the string matches regex)
– jacob.mccrumb
Nov 11 '18 at 20:24

add a comment |

 function greetMe() 
 $("#errors").css("background-color", "white");
 var name = document.getElementById("txtName").value;
 var nr = document.getElementById("txtNmr").value;
 $("#errors").empty();
 $("#greetings").empty();
 
 found_position = txtNmr.search(/d/);
 if (found_position = -1)
 $("#errors").append("Enter a number not a string");
 $("#errors").css("background-color", "yellow");
 
 
if (nr > 0 && nr < 21) 
 for (var counter = 0; counter < nr; counter = counter + 1) 
 $("#greetings").append("Hello, " + name + "<br />");
 
 else 
 $("#errors").append("Please Enter A Number Between 1 and 20");
 $("#errors").css("background-color", "yellow");

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p>Type in your name</p>
<input type="text" id="txtName">
<p>Enter a number 1-20.</p>
<input type="text" id="txtNmr">
<input type="button" value="Greet Me!" onclick="greetMe()">
<hr>
<div id="greetings">
 <!-- Section to output the greeting -->
</div>
<div id="errors">
 <!-- Section to output the greeting -->
</div>

edited Nov 12 '18 at 2:51

Poul Bak

5,43331132

asked Nov 11 '18 at 20:12

user10636563

133

 function greetMe() 
 $("#errors").css("background-color", "white");
 var name = document.getElementById("txtName").value;
 var nr = document.getElementById("txtNmr").value;
 $("#errors").empty();
 $("#greetings").empty();
 
 found_position = txtNmr.search(/d/);
 if (found_position = -1)
 $("#errors").append("Enter a number not a string");
 $("#errors").css("background-color", "yellow");
 
 
if (nr > 0 && nr < 21) 
 for (var counter = 0; counter < nr; counter = counter + 1) 
 $("#greetings").append("Hello, " + name + "<br />");
 
 else 
 $("#errors").append("Please Enter A Number Between 1 and 20");
 $("#errors").css("background-color", "yellow");

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p>Type in your name</p>
<input type="text" id="txtName">
<p>Enter a number 1-20.</p>
<input type="text" id="txtNmr">
<input type="button" value="Greet Me!" onclick="greetMe()">
<hr>
<div id="greetings">
 <!-- Section to output the greeting -->
</div>
<div id="errors">
 <!-- Section to output the greeting -->
</div>

 function greetMe() 
 $("#errors").css("background-color", "white");
 var name = document.getElementById("txtName").value;
 var nr = document.getElementById("txtNmr").value;
 $("#errors").empty();
 $("#greetings").empty();
 
 found_position = txtNmr.search(/d/);
 if (found_position = -1)
 $("#errors").append("Enter a number not a string");
 $("#errors").css("background-color", "yellow");
 
 
if (nr > 0 && nr < 21) 
 for (var counter = 0; counter < nr; counter = counter + 1) 
 $("#greetings").append("Hello, " + name + "<br />");
 
 else 
 $("#errors").append("Please Enter A Number Between 1 and 20");
 $("#errors").css("background-color", "yellow");

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p>Type in your name</p>
<input type="text" id="txtName">
<p>Enter a number 1-20.</p>
<input type="text" id="txtNmr">
<input type="button" value="Greet Me!" onclick="greetMe()">
<hr>
<div id="greetings">
 <!-- Section to output the greeting -->
</div>
<div id="errors">
 <!-- Section to output the greeting -->
</div>

 function greetMe() 
 $("#errors").css("background-color", "white");
 var name = document.getElementById("txtName").value;
 var nr = document.getElementById("txtNmr").value;
 $("#errors").empty();
 $("#greetings").empty();
 
 found_position = txtNmr.search(/d/);
 if (found_position = -1)
 $("#errors").append("Enter a number not a string");
 $("#errors").css("background-color", "yellow");
 
 
if (nr > 0 && nr < 21) 
 for (var counter = 0; counter < nr; counter = counter + 1) 
 $("#greetings").append("Hello, " + name + "<br />");
 
 else 
 $("#errors").append("Please Enter A Number Between 1 and 20");
 $("#errors").css("background-color", "yellow");

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p>Type in your name</p>
<input type="text" id="txtName">
<p>Enter a number 1-20.</p>
<input type="text" id="txtNmr">
<input type="button" value="Greet Me!" onclick="greetMe()">
<hr>
<div id="greetings">
 <!-- Section to output the greeting -->
</div>
<div id="errors">
 <!-- Section to output the greeting -->
</div>

javascript jquery html regex

edited Nov 12 '18 at 2:51

Poul Bak

5,43331132

asked Nov 11 '18 at 20:12

user10636563

133

edited Nov 12 '18 at 2:51

Poul Bak

5,43331132

asked Nov 11 '18 at 20:12

user10636563

133

edited Nov 12 '18 at 2:51

Poul Bak

5,43331132

edited Nov 12 '18 at 2:51

Poul Bak

5,43331132

edited Nov 12 '18 at 2:51

Poul Bak

5,43331132

asked Nov 11 '18 at 20:12

user10636563

133

asked Nov 11 '18 at 20:12

user10636563

133

asked Nov 11 '18 at 20:12

user10636563

133

To check if a string matches a regular expression, you can use txtNmr.match(/d/) or you can use /d/.test(txtNmr) (which will return true/false depending on if the string matches regex)
– jacob.mccrumb
Nov 11 '18 at 20:24

add a comment |

To check if a string matches a regular expression, you can use txtNmr.match(/d/) or you can use /d/.test(txtNmr) (which will return true/false depending on if the string matches regex)
– jacob.mccrumb
Nov 11 '18 at 20:24

To check if a string matches a regular expression, you can use txtNmr.match(/d/) or you can use /d/.test(txtNmr) (which will return true/false depending on if the string matches regex)
– jacob.mccrumb
Nov 11 '18 at 20:24

add a comment |

3 Answers
3

active

oldest

votes

/^d$/ means '0' or '1' or '2' or '3' or '4' or '5' or '6' or '7' or '8' or '9'. Any string different than this would be rejected, so '10' for example is rejected.

To add the remaining numbers 10 thorough 20, you can change the reg exp to: /^d1,2$/, which means any string composed by one to two digits, so the following is valid: '01', '2', '15', '84'...

Note that I added the ^ which means that the string must start with, and $ which means the string must end with.

Also I think there is a mistake in your code, it should be:

found_position = nr.search(/d/);

Instead of:

found_position = txtNmr.search(/d/);

So with the correct reg exp:

found_position = nr.search(/^d1,2$/);

Another mistake, the test condition isn't correct:

if (found_position = -1)

Should be:

if (found_position == -1)

Note the double ==

edited Nov 11 '18 at 23:37

answered Nov 11 '18 at 20:26

ankabout

668210

add a comment |

You are just testing if the string starts with a number, you need to check if its all numbers.

Regex explained: https://regexr.com/42t4f

 function greetMe() 
 $("#errors").css("background-color", "white");
 var name = document.getElementById("txtName").value;
 var nr = document.getElementById("txtNmr").value;
 $("#errors").empty();
 $("#greetings").empty();
 
 if (/^d+$/.test(nr) === false)
 $("#errors").append("Enter a number not a string");
 $("#errors").css("background-color", "yellow");
 
 
if (nr > 0 && nr < 21) 
 for (var counter = 0; counter < nr; counter = counter + 1) 
 $("#greetings").append("Hello, " + name + "<br />");
 
 else 
 $("#errors").append("Please Enter A Number Between 1 and 20");
 $("#errors").css("background-color", "yellow");

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p>Type in your name</p>
<input type="text" id="txtName">
<p>Enter a number 1-20.</p>
<input type="text" id="txtNmr">
<input type="button" value="Greet Me!" onclick="greetMe()">
<hr>
<div id="greetings">
 <!-- Section to output the greeting -->
</div>
<div id="errors">
 <!-- Section to output the greeting -->
</div>

answered Nov 11 '18 at 20:29

Benjaco

43439

add a comment |

You should use String.prototype.match to check if a string matches a regular expression.

String.prototype.search finds the index of the match within a String which is not a good indicator of whether or not the String actually matches the regular expression.

To match only whole numbers, you should use the regular expression /^d+$/

Also, you should put an if/else around the first condition that the input should be numeric. Otherwise, it will still print the greeting after the error message that the input should be a number.

 function greetMe() 
 $("#errors").css("background-color", "white");
 var name = document.getElementById("txtName").value;
 var nr = document.getElementById("txtNmr").value;
 $("#errors").empty();
 $("#greetings").empty();
 
 var found = nr.match(/^d+$/);
 if (!found)
 $("#errors").append("Enter a whole number, not a string or a decimal");
 $("#errors").css("background-color", "yellow");
 else 
 if (nr > 0 && nr < 21) 
 for (var counter = 0; counter < nr; counter = counter + 1) 
 $("#greetings").append("Hello, " + name + "<br />");
 
 else 
 $("#errors").append("Please Enter A Number Between 1 and 20");
 $("#errors").css("background-color", "yellow");

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p>Type in your name</p>
<input type="text" id="txtName">
<p>Enter a number 1-20.</p>
<input type="text" id="txtNmr">
<input type="button" value="Greet Me!" onclick="greetMe()">
<hr>
<div id="greetings">
 <!-- Section to output the greeting -->
</div>
<div id="errors">
 <!-- Section to output the greeting -->
</div>

Without Regex, you convert the string to a number and then round it down and then check if the rounded number converted to a string is equal to the original string and that the number is larger than or equal to 0.

function isPositiveInteger(str) 
 var n = Math.floor(+str);
 return n !== Infinity && String(n) === str && n >= 0;

 function greetMe() 
 $("#errors").css("background-color", "white");
 var name = document.getElementById("txtName").value;
 var nr = document.getElementById("txtNmr").value;
 $("#errors").empty();
 $("#greetings").empty();
 if (!isPositiveInteger(nr))
 $("#errors").append("Enter a whole number, not a string or a decimal");
 $("#errors").css("background-color", "yellow");
 else 
 if (nr > 0 && nr < 21) 
 for (var counter = 0; counter < nr; counter = counter + 1) 
 $("#greetings").append("Hello, " + name + "<br />");
 
 else 
 $("#errors").append("Please Enter A Number Between 1 and 20");
 $("#errors").css("background-color", "yellow");
 
 

function isPositiveInteger(str) 
 var n = Math.floor(+str);
 return n !== Infinity && String(n) === str && n >= 0;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p>Type in your name</p>
<input type="text" id="txtName">
<p>Enter a number 1-20.</p>
<input type="text" id="txtNmr">
<input type="button" value="Greet Me!" onclick="greetMe()">
<hr>
<div id="greetings">
 <!-- Section to output the greeting -->
</div>
<div id="errors">
 <!-- Section to output the greeting -->
</div>

edited Nov 12 '18 at 2:39

answered Nov 12 '18 at 2:29

hev1

5,5533527

add a comment |

Your Answer

StackExchange.ifUsing("editor", function ()
StackExchange.using("externalEditor", function ()
StackExchange.using("snippets", function ()
StackExchange.snippets.init();
);
);
, "code-snippets");

StackExchange.ready(function()
var channelOptions =
tags: "".split(" "),
id: "1"
;
initTagRenderer("".split(" "), "".split(" "), channelOptions);

StackExchange.using("externalEditor", function()
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled)
StackExchange.using("snippets", function()
createEditor();
);

else
createEditor();

);

function createEditor()
StackExchange.prepareEditor(
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader:
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
,
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
);

);

draft saved

draft discarded

StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53252773%2fjquery-regular-expression-checking-user-input-for-numbers%23new-answer', 'question_page');

);

Post as a guest

Name

Required, but never shown

3 Answers
3

active

oldest

votes

3 Answers
3

active

oldest

votes

/^d$/ means '0' or '1' or '2' or '3' or '4' or '5' or '6' or '7' or '8' or '9'. Any string different than this would be rejected, so '10' for example is rejected.

Note that I added the ^ which means that the string must start with, and $ which means the string must end with.

Also I think there is a mistake in your code, it should be:

found_position = nr.search(/d/);

Instead of:

found_position = txtNmr.search(/d/);

So with the correct reg exp:

found_position = nr.search(/^d1,2$/);

Another mistake, the test condition isn't correct:

if (found_position = -1)

Should be:

if (found_position == -1)

Note the double ==

edited Nov 11 '18 at 23:37

answered Nov 11 '18 at 20:26

ankabout

668210

add a comment |

/^d$/ means '0' or '1' or '2' or '3' or '4' or '5' or '6' or '7' or '8' or '9'. Any string different than this would be rejected, so '10' for example is rejected.

Note that I added the ^ which means that the string must start with, and $ which means the string must end with.

Also I think there is a mistake in your code, it should be:

found_position = nr.search(/d/);

Instead of:

found_position = txtNmr.search(/d/);

So with the correct reg exp:

found_position = nr.search(/^d1,2$/);

Another mistake, the test condition isn't correct:

if (found_position = -1)

Should be:

if (found_position == -1)

Note the double ==

edited Nov 11 '18 at 23:37

answered Nov 11 '18 at 20:26

ankabout

668210

add a comment |

/^d$/ means '0' or '1' or '2' or '3' or '4' or '5' or '6' or '7' or '8' or '9'. Any string different than this would be rejected, so '10' for example is rejected.

Note that I added the ^ which means that the string must start with, and $ which means the string must end with.

Also I think there is a mistake in your code, it should be:

found_position = nr.search(/d/);

Instead of:

found_position = txtNmr.search(/d/);

So with the correct reg exp:

found_position = nr.search(/^d1,2$/);

Another mistake, the test condition isn't correct:

if (found_position = -1)

Should be:

if (found_position == -1)

Note the double ==

edited Nov 11 '18 at 23:37

answered Nov 11 '18 at 20:26

ankabout

668210

/^d$/ means '0' or '1' or '2' or '3' or '4' or '5' or '6' or '7' or '8' or '9'. Any string different than this would be rejected, so '10' for example is rejected.

Note that I added the ^ which means that the string must start with, and $ which means the string must end with.

Also I think there is a mistake in your code, it should be:

found_position = nr.search(/d/);

Instead of:

found_position = txtNmr.search(/d/);

So with the correct reg exp:

found_position = nr.search(/^d1,2$/);

Another mistake, the test condition isn't correct:

if (found_position = -1)

Should be:

if (found_position == -1)

Note the double ==

edited Nov 11 '18 at 23:37

answered Nov 11 '18 at 20:26

ankabout

668210

edited Nov 11 '18 at 23:37

answered Nov 11 '18 at 20:26

ankabout

668210

answered Nov 11 '18 at 20:26

ankabout

668210

answered Nov 11 '18 at 20:26

ankabout

668210

add a comment |

You are just testing if the string starts with a number, you need to check if its all numbers.

Regex explained: https://regexr.com/42t4f

 function greetMe() 
 $("#errors").css("background-color", "white");
 var name = document.getElementById("txtName").value;
 var nr = document.getElementById("txtNmr").value;
 $("#errors").empty();
 $("#greetings").empty();
 
 if (/^d+$/.test(nr) === false)
 $("#errors").append("Enter a number not a string");
 $("#errors").css("background-color", "yellow");
 
 
if (nr > 0 && nr < 21) 
 for (var counter = 0; counter < nr; counter = counter + 1) 
 $("#greetings").append("Hello, " + name + "<br />");
 
 else 
 $("#errors").append("Please Enter A Number Between 1 and 20");
 $("#errors").css("background-color", "yellow");

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p>Type in your name</p>
<input type="text" id="txtName">
<p>Enter a number 1-20.</p>
<input type="text" id="txtNmr">
<input type="button" value="Greet Me!" onclick="greetMe()">
<hr>
<div id="greetings">
 <!-- Section to output the greeting -->
</div>
<div id="errors">
 <!-- Section to output the greeting -->
</div>

answered Nov 11 '18 at 20:29

Benjaco

43439

add a comment |

You are just testing if the string starts with a number, you need to check if its all numbers.

Regex explained: https://regexr.com/42t4f

 function greetMe() 
 $("#errors").css("background-color", "white");
 var name = document.getElementById("txtName").value;
 var nr = document.getElementById("txtNmr").value;
 $("#errors").empty();
 $("#greetings").empty();
 
 if (/^d+$/.test(nr) === false)
 $("#errors").append("Enter a number not a string");
 $("#errors").css("background-color", "yellow");
 
 
if (nr > 0 && nr < 21) 
 for (var counter = 0; counter < nr; counter = counter + 1) 
 $("#greetings").append("Hello, " + name + "<br />");
 
 else 
 $("#errors").append("Please Enter A Number Between 1 and 20");
 $("#errors").css("background-color", "yellow");

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p>Type in your name</p>
<input type="text" id="txtName">
<p>Enter a number 1-20.</p>
<input type="text" id="txtNmr">
<input type="button" value="Greet Me!" onclick="greetMe()">
<hr>
<div id="greetings">
 <!-- Section to output the greeting -->
</div>
<div id="errors">
 <!-- Section to output the greeting -->
</div>

answered Nov 11 '18 at 20:29

Benjaco

43439

add a comment |

You are just testing if the string starts with a number, you need to check if its all numbers.

Regex explained: https://regexr.com/42t4f

 function greetMe() 
 $("#errors").css("background-color", "white");
 var name = document.getElementById("txtName").value;
 var nr = document.getElementById("txtNmr").value;
 $("#errors").empty();
 $("#greetings").empty();
 
 if (/^d+$/.test(nr) === false)
 $("#errors").append("Enter a number not a string");
 $("#errors").css("background-color", "yellow");
 
 
if (nr > 0 && nr < 21) 
 for (var counter = 0; counter < nr; counter = counter + 1) 
 $("#greetings").append("Hello, " + name + "<br />");
 
 else 
 $("#errors").append("Please Enter A Number Between 1 and 20");
 $("#errors").css("background-color", "yellow");

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p>Type in your name</p>
<input type="text" id="txtName">
<p>Enter a number 1-20.</p>
<input type="text" id="txtNmr">
<input type="button" value="Greet Me!" onclick="greetMe()">
<hr>
<div id="greetings">
 <!-- Section to output the greeting -->
</div>
<div id="errors">
 <!-- Section to output the greeting -->
</div>

answered Nov 11 '18 at 20:29

Benjaco

43439

You are just testing if the string starts with a number, you need to check if its all numbers.

Regex explained: https://regexr.com/42t4f

 function greetMe() 
 $("#errors").css("background-color", "white");
 var name = document.getElementById("txtName").value;
 var nr = document.getElementById("txtNmr").value;
 $("#errors").empty();
 $("#greetings").empty();
 
 if (/^d+$/.test(nr) === false)
 $("#errors").append("Enter a number not a string");
 $("#errors").css("background-color", "yellow");
 
 
if (nr > 0 && nr < 21) 
 for (var counter = 0; counter < nr; counter = counter + 1) 
 $("#greetings").append("Hello, " + name + "<br />");
 
 else 
 $("#errors").append("Please Enter A Number Between 1 and 20");
 $("#errors").css("background-color", "yellow");

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p>Type in your name</p>
<input type="text" id="txtName">
<p>Enter a number 1-20.</p>
<input type="text" id="txtNmr">
<input type="button" value="Greet Me!" onclick="greetMe()">
<hr>
<div id="greetings">
 <!-- Section to output the greeting -->
</div>
<div id="errors">
 <!-- Section to output the greeting -->
</div>

 function greetMe() 
 $("#errors").css("background-color", "white");
 var name = document.getElementById("txtName").value;
 var nr = document.getElementById("txtNmr").value;
 $("#errors").empty();
 $("#greetings").empty();
 
 if (/^d+$/.test(nr) === false)
 $("#errors").append("Enter a number not a string");
 $("#errors").css("background-color", "yellow");
 
 
if (nr > 0 && nr < 21) 
 for (var counter = 0; counter < nr; counter = counter + 1) 
 $("#greetings").append("Hello, " + name + "<br />");
 
 else 
 $("#errors").append("Please Enter A Number Between 1 and 20");
 $("#errors").css("background-color", "yellow");

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p>Type in your name</p>
<input type="text" id="txtName">
<p>Enter a number 1-20.</p>
<input type="text" id="txtNmr">
<input type="button" value="Greet Me!" onclick="greetMe()">
<hr>
<div id="greetings">
 <!-- Section to output the greeting -->
</div>
<div id="errors">
 <!-- Section to output the greeting -->
</div>

 function greetMe() 
 $("#errors").css("background-color", "white");
 var name = document.getElementById("txtName").value;
 var nr = document.getElementById("txtNmr").value;
 $("#errors").empty();
 $("#greetings").empty();
 
 if (/^d+$/.test(nr) === false)
 $("#errors").append("Enter a number not a string");
 $("#errors").css("background-color", "yellow");
 
 
if (nr > 0 && nr < 21) 
 for (var counter = 0; counter < nr; counter = counter + 1) 
 $("#greetings").append("Hello, " + name + "<br />");
 
 else 
 $("#errors").append("Please Enter A Number Between 1 and 20");
 $("#errors").css("background-color", "yellow");

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p>Type in your name</p>
<input type="text" id="txtName">
<p>Enter a number 1-20.</p>
<input type="text" id="txtNmr">
<input type="button" value="Greet Me!" onclick="greetMe()">
<hr>
<div id="greetings">
 <!-- Section to output the greeting -->
</div>
<div id="errors">
 <!-- Section to output the greeting -->
</div>

answered Nov 11 '18 at 20:29

Benjaco

43439

answered Nov 11 '18 at 20:29

Benjaco

43439

answered Nov 11 '18 at 20:29

Benjaco

43439

answered Nov 11 '18 at 20:29

Benjaco

43439

add a comment |

You should use String.prototype.match to check if a string matches a regular expression.

String.prototype.search finds the index of the match within a String which is not a good indicator of whether or not the String actually matches the regular expression.

To match only whole numbers, you should use the regular expression /^d+$/

Also, you should put an if/else around the first condition that the input should be numeric. Otherwise, it will still print the greeting after the error message that the input should be a number.

 function greetMe() 
 $("#errors").css("background-color", "white");
 var name = document.getElementById("txtName").value;
 var nr = document.getElementById("txtNmr").value;
 $("#errors").empty();
 $("#greetings").empty();
 
 var found = nr.match(/^d+$/);
 if (!found)
 $("#errors").append("Enter a whole number, not a string or a decimal");
 $("#errors").css("background-color", "yellow");
 else 
 if (nr > 0 && nr < 21) 
 for (var counter = 0; counter < nr; counter = counter + 1) 
 $("#greetings").append("Hello, " + name + "<br />");
 
 else 
 $("#errors").append("Please Enter A Number Between 1 and 20");
 $("#errors").css("background-color", "yellow");

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p>Type in your name</p>
<input type="text" id="txtName">
<p>Enter a number 1-20.</p>
<input type="text" id="txtNmr">
<input type="button" value="Greet Me!" onclick="greetMe()">
<hr>
<div id="greetings">
 <!-- Section to output the greeting -->
</div>
<div id="errors">
 <!-- Section to output the greeting -->
</div>

function isPositiveInteger(str) 
 var n = Math.floor(+str);
 return n !== Infinity && String(n) === str && n >= 0;

 function greetMe() 
 $("#errors").css("background-color", "white");
 var name = document.getElementById("txtName").value;
 var nr = document.getElementById("txtNmr").value;
 $("#errors").empty();
 $("#greetings").empty();
 if (!isPositiveInteger(nr))
 $("#errors").append("Enter a whole number, not a string or a decimal");
 $("#errors").css("background-color", "yellow");
 else 
 if (nr > 0 && nr < 21) 
 for (var counter = 0; counter < nr; counter = counter + 1) 
 $("#greetings").append("Hello, " + name + "<br />");
 
 else 
 $("#errors").append("Please Enter A Number Between 1 and 20");
 $("#errors").css("background-color", "yellow");
 
 

function isPositiveInteger(str) 
 var n = Math.floor(+str);
 return n !== Infinity && String(n) === str && n >= 0;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p>Type in your name</p>
<input type="text" id="txtName">
<p>Enter a number 1-20.</p>
<input type="text" id="txtNmr">
<input type="button" value="Greet Me!" onclick="greetMe()">
<hr>
<div id="greetings">
 <!-- Section to output the greeting -->
</div>
<div id="errors">
 <!-- Section to output the greeting -->
</div>

edited Nov 12 '18 at 2:39

answered Nov 12 '18 at 2:29

hev1

5,5533527

add a comment |

You should use String.prototype.match to check if a string matches a regular expression.

String.prototype.search finds the index of the match within a String which is not a good indicator of whether or not the String actually matches the regular expression.

To match only whole numbers, you should use the regular expression /^d+$/

Also, you should put an if/else around the first condition that the input should be numeric. Otherwise, it will still print the greeting after the error message that the input should be a number.

 function greetMe() 
 $("#errors").css("background-color", "white");
 var name = document.getElementById("txtName").value;
 var nr = document.getElementById("txtNmr").value;
 $("#errors").empty();
 $("#greetings").empty();
 
 var found = nr.match(/^d+$/);
 if (!found)
 $("#errors").append("Enter a whole number, not a string or a decimal");
 $("#errors").css("background-color", "yellow");
 else 
 if (nr > 0 && nr < 21) 
 for (var counter = 0; counter < nr; counter = counter + 1) 
 $("#greetings").append("Hello, " + name + "<br />");
 
 else 
 $("#errors").append("Please Enter A Number Between 1 and 20");
 $("#errors").css("background-color", "yellow");

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p>Type in your name</p>
<input type="text" id="txtName">
<p>Enter a number 1-20.</p>
<input type="text" id="txtNmr">
<input type="button" value="Greet Me!" onclick="greetMe()">
<hr>
<div id="greetings">
 <!-- Section to output the greeting -->
</div>
<div id="errors">
 <!-- Section to output the greeting -->
</div>

function isPositiveInteger(str) 
 var n = Math.floor(+str);
 return n !== Infinity && String(n) === str && n >= 0;

 function greetMe() 
 $("#errors").css("background-color", "white");
 var name = document.getElementById("txtName").value;
 var nr = document.getElementById("txtNmr").value;
 $("#errors").empty();
 $("#greetings").empty();
 if (!isPositiveInteger(nr))
 $("#errors").append("Enter a whole number, not a string or a decimal");
 $("#errors").css("background-color", "yellow");
 else 
 if (nr > 0 && nr < 21) 
 for (var counter = 0; counter < nr; counter = counter + 1) 
 $("#greetings").append("Hello, " + name + "<br />");
 
 else 
 $("#errors").append("Please Enter A Number Between 1 and 20");
 $("#errors").css("background-color", "yellow");
 
 

function isPositiveInteger(str) 
 var n = Math.floor(+str);
 return n !== Infinity && String(n) === str && n >= 0;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p>Type in your name</p>
<input type="text" id="txtName">
<p>Enter a number 1-20.</p>
<input type="text" id="txtNmr">
<input type="button" value="Greet Me!" onclick="greetMe()">
<hr>
<div id="greetings">
 <!-- Section to output the greeting -->
</div>
<div id="errors">
 <!-- Section to output the greeting -->
</div>

edited Nov 12 '18 at 2:39

answered Nov 12 '18 at 2:29

hev1

5,5533527

add a comment |

You should use String.prototype.match to check if a string matches a regular expression.

String.prototype.search finds the index of the match within a String which is not a good indicator of whether or not the String actually matches the regular expression.

To match only whole numbers, you should use the regular expression /^d+$/

Also, you should put an if/else around the first condition that the input should be numeric. Otherwise, it will still print the greeting after the error message that the input should be a number.

 function greetMe() 
 $("#errors").css("background-color", "white");
 var name = document.getElementById("txtName").value;
 var nr = document.getElementById("txtNmr").value;
 $("#errors").empty();
 $("#greetings").empty();
 
 var found = nr.match(/^d+$/);
 if (!found)
 $("#errors").append("Enter a whole number, not a string or a decimal");
 $("#errors").css("background-color", "yellow");
 else 
 if (nr > 0 && nr < 21) 
 for (var counter = 0; counter < nr; counter = counter + 1) 
 $("#greetings").append("Hello, " + name + "<br />");
 
 else 
 $("#errors").append("Please Enter A Number Between 1 and 20");
 $("#errors").css("background-color", "yellow");

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p>Type in your name</p>
<input type="text" id="txtName">
<p>Enter a number 1-20.</p>
<input type="text" id="txtNmr">
<input type="button" value="Greet Me!" onclick="greetMe()">
<hr>
<div id="greetings">
 <!-- Section to output the greeting -->
</div>
<div id="errors">
 <!-- Section to output the greeting -->
</div>

function isPositiveInteger(str) 
 var n = Math.floor(+str);
 return n !== Infinity && String(n) === str && n >= 0;

 function greetMe() 
 $("#errors").css("background-color", "white");
 var name = document.getElementById("txtName").value;
 var nr = document.getElementById("txtNmr").value;
 $("#errors").empty();
 $("#greetings").empty();
 if (!isPositiveInteger(nr))
 $("#errors").append("Enter a whole number, not a string or a decimal");
 $("#errors").css("background-color", "yellow");
 else 
 if (nr > 0 && nr < 21) 
 for (var counter = 0; counter < nr; counter = counter + 1) 
 $("#greetings").append("Hello, " + name + "<br />");
 
 else 
 $("#errors").append("Please Enter A Number Between 1 and 20");
 $("#errors").css("background-color", "yellow");
 
 

function isPositiveInteger(str) 
 var n = Math.floor(+str);
 return n !== Infinity && String(n) === str && n >= 0;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p>Type in your name</p>
<input type="text" id="txtName">
<p>Enter a number 1-20.</p>
<input type="text" id="txtNmr">
<input type="button" value="Greet Me!" onclick="greetMe()">
<hr>
<div id="greetings">
 <!-- Section to output the greeting -->
</div>
<div id="errors">
 <!-- Section to output the greeting -->
</div>

edited Nov 12 '18 at 2:39

answered Nov 12 '18 at 2:29

hev1

5,5533527

You should use String.prototype.match to check if a string matches a regular expression.

String.prototype.search finds the index of the match within a String which is not a good indicator of whether or not the String actually matches the regular expression.

To match only whole numbers, you should use the regular expression /^d+$/

Also, you should put an if/else around the first condition that the input should be numeric. Otherwise, it will still print the greeting after the error message that the input should be a number.

 function greetMe() 
 $("#errors").css("background-color", "white");
 var name = document.getElementById("txtName").value;
 var nr = document.getElementById("txtNmr").value;
 $("#errors").empty();
 $("#greetings").empty();
 
 var found = nr.match(/^d+$/);
 if (!found)
 $("#errors").append("Enter a whole number, not a string or a decimal");
 $("#errors").css("background-color", "yellow");
 else 
 if (nr > 0 && nr < 21) 
 for (var counter = 0; counter < nr; counter = counter + 1) 
 $("#greetings").append("Hello, " + name + "<br />");
 
 else 
 $("#errors").append("Please Enter A Number Between 1 and 20");
 $("#errors").css("background-color", "yellow");

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p>Type in your name</p>
<input type="text" id="txtName">
<p>Enter a number 1-20.</p>
<input type="text" id="txtNmr">
<input type="button" value="Greet Me!" onclick="greetMe()">
<hr>
<div id="greetings">
 <!-- Section to output the greeting -->
</div>
<div id="errors">
 <!-- Section to output the greeting -->
</div>

function isPositiveInteger(str) 
 var n = Math.floor(+str);
 return n !== Infinity && String(n) === str && n >= 0;

 function greetMe() 
 $("#errors").css("background-color", "white");
 var name = document.getElementById("txtName").value;
 var nr = document.getElementById("txtNmr").value;
 $("#errors").empty();
 $("#greetings").empty();
 if (!isPositiveInteger(nr))
 $("#errors").append("Enter a whole number, not a string or a decimal");
 $("#errors").css("background-color", "yellow");
 else 
 if (nr > 0 && nr < 21) 
 for (var counter = 0; counter < nr; counter = counter + 1) 
 $("#greetings").append("Hello, " + name + "<br />");
 
 else 
 $("#errors").append("Please Enter A Number Between 1 and 20");
 $("#errors").css("background-color", "yellow");
 
 

function isPositiveInteger(str) 
 var n = Math.floor(+str);
 return n !== Infinity && String(n) === str && n >= 0;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p>Type in your name</p>
<input type="text" id="txtName">
<p>Enter a number 1-20.</p>
<input type="text" id="txtNmr">
<input type="button" value="Greet Me!" onclick="greetMe()">
<hr>
<div id="greetings">
 <!-- Section to output the greeting -->
</div>
<div id="errors">
 <!-- Section to output the greeting -->
</div>

 function greetMe() 
 $("#errors").css("background-color", "white");
 var name = document.getElementById("txtName").value;
 var nr = document.getElementById("txtNmr").value;
 $("#errors").empty();
 $("#greetings").empty();
 
 var found = nr.match(/^d+$/);
 if (!found)
 $("#errors").append("Enter a whole number, not a string or a decimal");
 $("#errors").css("background-color", "yellow");
 else 
 if (nr > 0 && nr < 21) 
 for (var counter = 0; counter < nr; counter = counter + 1) 
 $("#greetings").append("Hello, " + name + "<br />");
 
 else 
 $("#errors").append("Please Enter A Number Between 1 and 20");
 $("#errors").css("background-color", "yellow");

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p>Type in your name</p>
<input type="text" id="txtName">
<p>Enter a number 1-20.</p>
<input type="text" id="txtNmr">
<input type="button" value="Greet Me!" onclick="greetMe()">
<hr>
<div id="greetings">
 <!-- Section to output the greeting -->
</div>
<div id="errors">
 <!-- Section to output the greeting -->
</div>

 function greetMe() 
 $("#errors").css("background-color", "white");
 var name = document.getElementById("txtName").value;
 var nr = document.getElementById("txtNmr").value;
 $("#errors").empty();
 $("#greetings").empty();
 
 var found = nr.match(/^d+$/);
 if (!found)
 $("#errors").append("Enter a whole number, not a string or a decimal");
 $("#errors").css("background-color", "yellow");
 else 
 if (nr > 0 && nr < 21) 
 for (var counter = 0; counter < nr; counter = counter + 1) 
 $("#greetings").append("Hello, " + name + "<br />");
 
 else 
 $("#errors").append("Please Enter A Number Between 1 and 20");
 $("#errors").css("background-color", "yellow");

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p>Type in your name</p>
<input type="text" id="txtName">
<p>Enter a number 1-20.</p>
<input type="text" id="txtNmr">
<input type="button" value="Greet Me!" onclick="greetMe()">
<hr>
<div id="greetings">
 <!-- Section to output the greeting -->
</div>
<div id="errors">
 <!-- Section to output the greeting -->
</div>

 function greetMe() 
 $("#errors").css("background-color", "white");
 var name = document.getElementById("txtName").value;
 var nr = document.getElementById("txtNmr").value;
 $("#errors").empty();
 $("#greetings").empty();
 if (!isPositiveInteger(nr))
 $("#errors").append("Enter a whole number, not a string or a decimal");
 $("#errors").css("background-color", "yellow");
 else 
 if (nr > 0 && nr < 21) 
 for (var counter = 0; counter < nr; counter = counter + 1) 
 $("#greetings").append("Hello, " + name + "<br />");
 
 else 
 $("#errors").append("Please Enter A Number Between 1 and 20");
 $("#errors").css("background-color", "yellow");
 
 

function isPositiveInteger(str) 
 var n = Math.floor(+str);
 return n !== Infinity && String(n) === str && n >= 0;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p>Type in your name</p>
<input type="text" id="txtName">
<p>Enter a number 1-20.</p>
<input type="text" id="txtNmr">
<input type="button" value="Greet Me!" onclick="greetMe()">
<hr>
<div id="greetings">
 <!-- Section to output the greeting -->
</div>
<div id="errors">
 <!-- Section to output the greeting -->
</div>

 function greetMe() 
 $("#errors").css("background-color", "white");
 var name = document.getElementById("txtName").value;
 var nr = document.getElementById("txtNmr").value;
 $("#errors").empty();
 $("#greetings").empty();
 if (!isPositiveInteger(nr))
 $("#errors").append("Enter a whole number, not a string or a decimal");
 $("#errors").css("background-color", "yellow");
 else 
 if (nr > 0 && nr < 21) 
 for (var counter = 0; counter < nr; counter = counter + 1) 
 $("#greetings").append("Hello, " + name + "<br />");
 
 else 
 $("#errors").append("Please Enter A Number Between 1 and 20");
 $("#errors").css("background-color", "yellow");
 
 

function isPositiveInteger(str) 
 var n = Math.floor(+str);
 return n !== Infinity && String(n) === str && n >= 0;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p>Type in your name</p>
<input type="text" id="txtName">
<p>Enter a number 1-20.</p>
<input type="text" id="txtNmr">
<input type="button" value="Greet Me!" onclick="greetMe()">
<hr>
<div id="greetings">
 <!-- Section to output the greeting -->
</div>
<div id="errors">
 <!-- Section to output the greeting -->
</div>

edited Nov 12 '18 at 2:39

answered Nov 12 '18 at 2:29

hev1

5,5533527

edited Nov 12 '18 at 2:39

answered Nov 12 '18 at 2:29

hev1

5,5533527

answered Nov 12 '18 at 2:29

hev1

5,5533527

answered Nov 12 '18 at 2:29

hev1

5,5533527

add a comment |

draft saved

draft discarded

Thanks for contributing an answer to Stack Overflow!

Please be sure to answer the question. Provide details and share your research!

But avoid …

Asking for help, clarification, or responding to other answers.

Making statements based on opinion; back them up with references or personal experience.

To learn more, see our tips on writing great answers.

Some of your past answers have not been well-received, and you're in danger of being blocked from answering.

Please pay close attention to the following guidance:

Please be sure to answer the question. Provide details and share your research!

But avoid …

Asking for help, clarification, or responding to other answers.

Making statements based on opinion; back them up with references or personal experience.

To learn more, see our tips on writing great answers.

draft saved

draft discarded

Post as a guest

Name

Required, but never shown

Name

Required, but never shown

Name

Required, but never shown

This page is only for reference, If you need detailed information, please check here

搜尋此網誌

Pfthb