CODEWITHSUNDEEP
javascripthtml
swift-lynx
swift-lynx

Reputation: 3765

Disallow input if it matches predefined values

I would like to disallow certain input into an html input field.

Manually type in a value in a "Select" / Drop-down HTML list? this question covers how to recommend values while letting the user type.

I would like to let the user type and 'blacklist' certain values if they matches one of my predefined values and show a warning.

What is the easiest way to achieve this?

Upvotes: 0

Views: 76

Answers (2)

zomega
zomega

Reputation: 2316

You can also use a regular expression. It's only possible to submit the form if the text does not contain foo.

<form action="#">
  <input type="text" name="xx" pattern="^((?!foo).)*$"><br />
  <input type="submit">
</form>

Upvotes: 1

Silviu Burcea
Silviu Burcea

Reputation: 5348

function myFunction(e) {
  const val = e.value;
  const blacklist = ["12345678", "qwerty"];
  if (blacklist.indexOf(val) >= 0) alert("Blacklist");
}
<p>A function is triggered when the user releases a key in the input field.</p>
Enter your name: <input type="text" id="fname" onkeyup="myFunction(this)">

You need to play with keyup event and provide a blacklist. You can do whatever you want with val, you could check if it's one of blacklist values(example above) or if it matches a RegExp pattern.

Upvotes: 1

Related Questions