DataRange на js

582

04 августа 2017, 02:50

Задача создать компонент, представляющий собой два инпута выбора дат, для установки промежутка времени. Без фреймворков. Я в плане практики пока нуб, посоветуйте с чего начать хотя бы. И где можно готовый календарь взять? Или лучше самому написать?

Answer 1

Я тоже всегда переизобретаю велосипед, потому что считаю, что лучший фреймворк - это свой фреймворк. Однако форму для выбора дат сделать не так просто - здесь лучше посмотреть готовую работу (долго просто объяснять) - http://amsul.ca/pickadate.js/date/ вот здесь красивый очень скрипт, можете еще поискать по запросу js date picker.

Дальше необходимо преобразовать выбранную дату в timestamp для удобства. Предположим что у Вас есть форма с двумя дата пикетами и следующими id: date1, date2.

var date1 = new Date(document.getElementById("date1").value).getTime()

Потом

var date2 = new Date(document.getElementById("date2").value).getTime()

И для получения range'a просто Math.abs(date1 - date2). Ответ будет в миллисекундах =) Делим на 1000, получаем секунды.

На самом деле сложно понятно объяснить - много всего, однако интересного, Вам надо изучить: Date Picker, работу с формами в JS или вообще с элементами (как получить текст/значение элемента html) и почитать про Date в javascript.