How to validate user name with regular expression

Question

I'd want to validate a username using a regular expression, however the expression I used worked well on https://regexr.com/ but not in my code. I just want user can add only Alphanumeric and a space between them

var letters = /^[A-Za-z]+$/g;

function validate() {
  var input = document.getElementById("fname").value;
  if (input.match(letters)) {
    document.getElementById("name").innerHTML = "** Only alphabets are allowed in name.";
    return false;
  }
}

<input id="fname">
<input type="button" onclick="validate()" value="Check">
<br>
<span id="name"></span>

It is usually a bad idea to limit user names, for example Peter O'Donelly-Smith might not be happy with that. Why do you need to limit user names? That might help us find a better solution for you. — Andrew Morton
– Andrew Morton, Commented Oct 8, 2021 at 17:45
I actually want to validate user names so that a user can input their names in the format "Ali Ahmed." — Bisma Amjad
– Bisma Amjad, Commented Oct 8, 2021 at 17:49
@AndrewMorton I don't agree... messy username will be a bad idea. Will look bad for other users, and will be annoying, if someone will exploit it. Every decent service does limit user names. — Flash Thunder
– Flash Thunder, Commented Oct 8, 2021 at 17:51
Does this answer your question? Regular expression "^[a-zA-Z]" or "[^a-zA-Z]" — Andrew Morton
– Andrew Morton, Commented Oct 8, 2021 at 17:51
@FlashThunder Try telling that to anyone who wants their name to be represented correctly, but the system does not allow it. — Andrew Morton
– Andrew Morton, Commented Oct 8, 2021 at 17:56

Brian Scramlin · Accepted Answer · 2021-10-08 18:03:20Z

1

Your current function is "finding alphanumeric characters". So, when you run validate(), it is returning either a valid Array, or null. To get spaces use /^[\w\-\s]+$/ although this will return true for multiple spaces. I'm not sure your use case.

Unless you want to change your regex, you need to show your warning when input.match() returns a falsey value. To do this, Place ! before your input.match() function

var letters = /^[\w\-\s]+$/;

function validate() {
  document.getElementById("name").innerHTML = "";

  var input = document.getElementById("fname").value;

  if (!input.match(letters)) {
document.getElementById("name").innerHTML = "** Only alphabets are allowed in name.";
return false;
  }
}

<input id="fname">
<input type="button" onclick="validate()" value="Check">
<br>
<span id="name"></span>

edited Oct 8, 2021 at 18:03

answered Oct 8, 2021 at 17:50

Brian Scramlin

3682 silver badges13 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Brian Scramlin Over a year ago

Yeah, guys I should have read the question more specifically instead of just bug-fixing the existing code. I will update or remove my answer.

Brian Scramlin Over a year ago

Also, is this duplicate of stackoverflow.com/questions/13283470/… ?

Collectives™ on Stack Overflow

How to validate user name with regular expression

1 Answer 1

2 Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Linked

Related