Regular expression in Pattern

Asked

Viewed 271 times

3

I have a text input that I’m validating with regular expression, the expression rule is the following: it starts with a number between 0 and 2 and then 6 more random numbers, but I don’t know why it doesn’t work.

<input pattern="^[0-2][0-9]{6}$" required type="text" class="form-control"/>

Follow the whole page code..

<div class="container">
<div class="row">
  <div class="col-md-12">
     <nav class="navbar navbar-default" role="navigation">
        <div class="navbar-header">
        <a class="navbar-brand" href="">Lista de Serviços</a>
        </div>
        <div class="collapse navbar-collapse">
           <ul class="nav navbar-nav">
            <li class="dropdown">
              <a href="#" class="dropdown-toggle" data-toggle="dropdown">Selecione o setor <span class="caret"></span></a>
              <ul class="dropdown-menu" role="menu">
                <li><a href="#">APS</a></li>
                <li><a href="#">GEX</a></li>
                <li><a href="#">Logística</a></li>
                <li><a href="#">Seat</a></li>
              </ul>
            </li>
            </ul>
            <ul class="nav navbar-nav navbar-right">
              <li class="dropdown">
                 <a href="" class="dropdown-toggle" data-toggle="dropdown">Login <b class="caret"></b></a>
                 <ul class="dropdown-menu" style="padding: 15px;min-width: 250px;">
                    <li>
                       <div class="row">
                          <div class="col-md-12">
                             <form class="form">
                                <div class="form-group">
                                   <input pattern="^[0-2][0-9]{6}$" required type="text" class="form-control" placeholder="Matrícula" />
                                </div>
                                <div class="form-group">
                                   <input type="password" class="form-control" placeholder="Senha" required />
                                </div>
                                <div class="form-group">
                                   <button type="submit" class="btn btn-success btn-block">Login</button>
                                </div>
                             </form>
                          </div>
                       </div>
                    </li>
                 </ul>
              </li>
             </ul>
           </ul>
        </div>
     </nav>
  </div>

  • 3

    It works for me... https://jsfiddle.net/aLrff0j2/ what’s the problem you’re having?

  • when I type for example 2155898 it shows error message even if it is in the default.

  • 1

    In fact, when I tested your example, it also worked... https://jsfiddle.net/aLrff0j2/1/

  • 1

    @user37750 What browser you are using?

  • I’m using Google Chrome.

  • I just tested it on the mozzarella and gave it the same mistake

  • Have you ever tried to create a separate page, just with this input, to verify this error?

  • I tried it on a separate page and it worked, thanks for the tip.

  • So we already know that the problem is in the middle of your code, I can’t imagine what it is, but you could post it, just what you think might be causing it, so we can analyze it.

  • posted all the page code

  • Just one question, the error you refer to is the factor of not being able to submit the form even with valid numbers?

  • yes it is that mistake

  • I copied your code, and Linkei the bootstrap, and the login form works normally... Look: http://s12.postimg.org/e52avc8dp/Captura_de_Tela_12.png

  • It worked for me here too

  • Your answer to Samir Braga’s question shows that you did not add the "POST" method to the form tag.

Show 10 more comments

1 answer

1

You need to set the first digit as below:

pattern="^[0-2]{1}[0-9]{6}$"

Browser other questions tagged

You are not signed in. Login or sign up in order to post.