How do i make a specific pattern for my html input

Question

I'm trying to make a custom pattern for my html input but have no idea how to do so!

The pattern I want: ABC-A0-01

So basically the first part has uppercase alphabets only, second part has uppercase with numeric values, and the last part is numeric only and is separated by a '-'

<input type="text" class="form-control txtsize" id="equi" placeholder="Insert equipment name e.g ABC-A0-12" data-ng-model="equipmentToAdd">

Nisarg Shah · Accepted Answer · 2017-09-23 10:53:01Z

3

You could use the pattern attribute with a RegEx such as this: pattern="[A-Z]{3}[-][A-Z]{1}[0-9]{1}[-][0-9]{2}".

Try inputting an invalid value, and hit submit. The browser will give an error with the message from title property.

<form>

  <input type="text" class="form-control txtsize" id="equi" placeholder="Insert equipment name e.g ABC-A0-12" data-ng-model="equipmentToAdd" pattern="[A-Z]{3}[-][A-Z]{1}[0-9]{1}[-][0-9]{2}" title="Insert equipment name e.g ABC-A0-12">
  <button type="submit">Submit</button>
</form>

answered Sep 23, 2017 at 10:53

Nisarg Shah

14.6k6 gold badges38 silver badges58 bronze badges

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

Collectives™ on Stack Overflow

How do i make a specific pattern for my html input

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related