Как избежать ввода алфавитов в поле выбора даты? - PullRequest
0 голосов
/ 10 февраля 2020

Как избежать ввода алфавитов в поле выбора даты?

Я использую bsDatePicker

Я использовал type = "number", но я получаю это предупреждение, и я не могу выбрать дата

"The specified value "02/03/2020" is not a valid number. The value must match to the following regular expression: -?(\d+|\d+\.\d+|\.\d+)([eE][-+]?\d+)?"

Ответы [ 5 ]

1 голос
/ 10 февраля 2020

Вы не можете определить тип номера, вы можете просто определить как:

public taskDate = new Date();

в вашем файле .ts

Определите нижеприведенный код в. html файле

 <input type="text" readOnly class="form-contr bsDatepicker
                         placeholder="Select Date" [(ngModel)]="taskDate"
                         [bsConfig]="{ dateInputFormat: 'YYYY-MM-DD' }">

Не забудьте добавить тег readOnly во входной текст.

0 голосов
/ 10 февраля 2020

Просто используйте дату для решения вашей проблемы:

<input type="date"
        [minDate]="minDate"
        [maxDate]="maxDate"
        bsDatepicker [(bsValue)]="yourDateValue">

Вот пример

0 голосов
/ 10 февраля 2020

Вы можете попробовать это событие keyup на вашем входе следующим образом:

<input onkeyup="this.value=this.value.replace(/[^\d]/,'')" >
0 голосов
/ 10 февраля 2020

вы можете использовать шаблон в поле ввода вместо type="number"

Например: <input type="text" pattern="(0?[1-9]|[12][0-9]|3[01])/(0?[1-9]|1[012])/\d{4}">

Кроме того, если вы назначаете значение для этого ввода из средства выбора даты, сделать это поле ввода readonly

0 голосов
/ 10 февраля 2020

Использование события события нажатия клавиши предотвращать событие нажатия клавиши () для отмены события нажатия клавиши.

Попробуйте это:

<div class="col-xs-12 col-12 col-md-4 form-group">
    <input (keypress)="$event.preventDefault()"
     type="text"
           placeholder="Datepicker"
           class="form-control"
           bsDatepicker>
  </div>

или Использовать атрибут readonly

<div class="col-xs-12 col-12 col-md-4 form-group">
    <input readonly
     type="text"
           placeholder="Datepicker"
           class="form-control"
           bsDatepicker>
  </div>

Пример * * 1 013

...