Question

I have this HTML field:

<input type="text" name="userInput" id="userInput">

I want to make sure that the user enters either at least five characters or nothing at all.

This code, which only tests for the minimum five characters is working fine:

userInputValue = $("#userInput").val();
if (/^([A-Za-z]{5,})/.test(userInputValue) === false) {
    alert("More than five, please!");
    return false;
}

However, when I try to add a condition to skip this check if the field is blank, either like this

userInputValue = $("#userInput").val();
if (userInputValue !== "") {
    if (/^([A-Za-z]{5,})/.test(userInputValue) === false) {
        alert("Either more than five or none at all, please!");
        return false;
    }
}

or like this

userInputValue = $("#userInput").val();
if (/^([A-Za-z]{5,})/.test(userInputValue) === false && userInputValue !== "") {
    alert("Either more than five or none at all, please!");
    return false;
}

the check fails completely and anything is let through. What am I doing wrong and how do I make it work? I’m not getting any info from the debugger.

Answer 1

Just changed a bit, adding a ? right place.

userInputValue = $("#userInput").val();
if (userInputValue !== "") {
    if (/^([A-Za-z]{5,})?$/.test(userInputValue) === false) {
        alert("Either more than five or none at all, please!");
        return false;
    }
}

RegEx Explantion

"^" +              // Assert position at the beginning of a line (at beginning of the string or after a line break character)
"(" +              // Match the regular expression below and capture its match into backreference number 1
   "[A-Za-z]" +       // Match a single character present in the list below
                         // A character in the range between “A” and “Z”
                         // A character in the range between “a” and “z”
      "{5,}" +           // Between 5 and unlimited times, as many times as possible, giving back as needed (greedy)
")?" +             // Between zero and one times, as many times as possible, giving back as needed (greedy)
"$"                // Assert position at the end of a line (at the end of the string or before a line break character)

---

Hope this helps