Как правильно составить html pattern

126

09 августа 2019, 02:10

В поле задаю тип string, и нужно чтобы проверялось на количество символов, максимально 7 штук, и чтобы можно было вводить только цифры в виде строки. Как это правильно реализовать, подскажите пожалуйста:

$(function() { 
  $("input[name=km]").on("invalid", function() { 
    this.setCustomValidity("Код материала должен содержать 7 цифр."); 
  }); 
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> 
 
<form> 
  <label>Матеріал</label> <input type="text" pattern="[0-9]{,7}" maxlength="7" class="input-sort" size="15px" name="km" id="km" align="middle" placeholder="Код"> 
  <button id="filtAccept">клёц</button> 
</form>

Answer 1

pattern = [\d]{7}

или

pattern = [0-9]{7}

Answer 2

Я бы совсем отказался от скрипта, если не предполагается более тщательная проверка и дополнительные действия:

.input-wrap { 
  position: relative; 
  display: inline-block; 
} 
 
#km+span { 
  position: absolute; 
  top: 0; 
  left: 0; 
  width: 100%; 
  border: 1px solid red; 
  font: oblique .75em 'Arial'; 
  text-align: center; 
  color: #754; 
  background-color: #fec; 
  opacity: 0; 
  pointer-events: none; 
  transition: .5s ease; 
} 
 
#km:invalid+span { 
  opacity: 1; 
  top: 2.1em; 
}

<form> 
  <label>Матеріал</label> 
  <span class="input-wrap"> 
    <input type="text" pattern="\d{7}" maxlength="7" class="input-sort" name="km" id="km" placeholder="Код"> 
    <span>Код материала должен содержать 7 цифр.</span> 
  </span> 
  <button id="filtAccept">клёц</button> 
</form>

ПОСЛЕДНИЕ ВОПРОСЫ

Все вопросы

ТОП-10

Все популярные вопросы

Загрузка изображений в папку dist

Не получается при сборке проекта через webpack перенести все изображения из папки src/imadges в папку dist/imades чтобы сохранились путиИспользую file-loader

113

MySQL

MYSQL Sum Union - правильный запрос

Искал как реализовать объединение сумм int полей разных таблиц и нашёл данный ответ - https://stackoverflowcom/a/2387773/6763536 всё работает но просто не могу...

110

MySQL

SQL как оптимизировать запрос?

Есть следующий запрос:

132

MySQL

Как проверить наличие значения в базе данных в LUA

пишу скрипт на LUA, нужно решить такую задачуСуществует таблица в базе, в ней имеются колонки "Account" и "Model" и мне нужно узнать существует ли определенное...

120