Как сделать два таких зависимых друг от друга time inputs?

Question

[ArtJH]

Референс с яндекс календарь.

Я не знаю как сделать:
1) инпут не принимает новое значение если оно не в диапазоне от 00:00 до 23:00. То есть если я напишу 50:90, то инпут не примет такое значение
2) если у первого инпута значение с 9:00, то в второго инпута должно начинаться позже 9:00. То есть значение раньше, чем первое он не примет

Решение должно быть на чистом js. Так как используется vue

Может есть плагины готовые? Тоже ищу гуглю

Answer 1

[Lord_Dantes]

https://element.eleme.io/#/en-US

Comments

[ArtJH]

Спасибо, полезная штука, но вопрос не решило

[Lord_Dantes]

ArtJH, что вас не устроило там?

Answer 2

[Дмитрий Арушанов]

1) Взять готовый Time Input компонент. Или даже Date Time. Застилить его под свой UI. (на том же Vue их достаточно)
У них реализована уже валидация для покрытия (50:90)
2)Как правило большенство плагинов поддерживают свойства - minRangeValue - maxRangeValue, c помощью которых и можно этим управлять.