Checking input for admin and user using Regular Expression

Question

I'm trying to create a function that will check the users input if it has the input of admin. It keeps on displaying correct even if its incorrect, but when I hard code the value of user input and admin it checks whether the output is correct or incorrect. I want the users to input the value and check whether it is correct or wrong.

var str = document.getElementById('user');
var str2 = document.getElementById('admin');
var reg = new RegExp(str2.value, "i");
var result = str.value.match(reg);

function sample() {
  if (result) {
    document.getElementById('checker').innerHTML = "correct";
  } else {
    document.getElementById('checker').innerHTML = "wrong";
  }
}

<textarea id="admin" placeholder="admin" rows="5"></textarea>
<textarea id="user" placeholder="user" rows="5"></textarea>
<textarea id="checker"></textarea>
<br>
<button style="height: 50px; width: 100px;" onclick="sample()">Check</button>

You are using `new RegExp(str2.value, "i");` Note that in the RegExp constuctor you have to double escape backslashes, [escape meta characters](https://stackoverflow.com/questions/3115150/how-to-escape-regular-expression-special-characters-using-javascript) to match them literally and if you don't want partial matches you have to use anchors `^` and `$` — The fourth bird, Oct 31 '21 at 09:50
What is `str2.value`? It will always be an empty string because you're trying to grab it before you call the function. Always. It doesn't matter if the user has entered anything into the textarea. — Andy, Oct 31 '21 at 09:54
Most likely, you are getting the `input` values at loading of the DOM, and not when you click your buttons. So they will be both empty, and of course an empty string is matched by an regex for an empty string. Try moving all your code inside your `sample` function — derpirscher, Oct 31 '21 at 10:04

score 0 · Answer 1 · answered Oct 31 '21 at 19:34

The str2.value and str.value hold no value inside your sample() function as they are not defined in the function scope. The code lines where these values are read from the input text boxes should be placed inside the sample() function body.

Another issue is that when you check whether a stirng contains another string with a regex, you should account for special chars in the str2.value. Without properly escaping it, ( or ?, or even . would yield unwelcome behavior. You can use a simple non-regex solution from Contains case insensitive post here since you are using fixed string values here.

function sample() {
  var str = document.getElementById('user');
  var str2 = document.getElementById('admin');

  if (str.value.toUpperCase().indexOf(str2.value.toUpperCase()) === -1) {
    document.getElementById('checker').innerHTML = "correct";
  } else {
    document.getElementById('checker').innerHTML = "wrong";
  }
}

<textarea id="admin" placeholder="admin" rows="5"></textarea>
<textarea id="user" placeholder="user" rows="5"></textarea>
<textarea id="checker"></textarea>
<br>
<button style="height: 50px; width: 100px;" onclick="sample()">Check</button>

Checking input for admin and user using Regular Expression

1 Answers1