Почему ошибка в getDate?

Question

[drtvader]

Привет! Почему скрипт выдает ошибку на getDate?
Потому что это строка?

function formatDate(str) {
            var firstDate = document.getElementsByClassName("firstDate")[0].value;
            var secondDate = document.getElementsByClassName("secondDate")[0].value;

            function validDate() {
                str2 = str.split(".");
                if (str2.length != 3) {
                    return false;
                }
                str2 = str2[2] + '-' + str2[1] + '-' + str2[0];
                if (new Date(str2) == 'Invalid Date') {
                    return false;
                }
                return str;
            }
            if (validDate()) {
                document.getElementById("output").innerHTML = " ";
                if (firstDate > secondDate) {
                    text = "Первая дата должна быть меньше";
                } else {
                    text = "";
                    var timeDiff = Math.abs(firstDate.getDate() - secondDate.getDate());
                    var diffDays = Math.ceil(timeDiff / (1000 * 3600 * 24));
                    alert(diffDays);
                }
                document.getElementById("output").innerHTML = text;
            } else {
                document.getElementById("output").innerHTML = "Введите правильно дату";
            };
        }

Введите дату в заданном формате

Answer 1

[Алексей Уколов]

Разумеется, потому что это строка.

Comments

[drtvader]

Я так понимаю таким способом можно распарсить строку Date.parse(firstDate); но как перевести это в следующую часть функции, где будет проводиться расчет?

[drtvader]

почему-то вторую дату распарсить не хочет, пишет NaN

[Yurii Nekrasov]

drtvader: потому что 15 воспринимается как месяц, 11 - число, 2016 - год

Answer 2

[Yurii Nekrasov]

попробуйте так:

var timeDiff = Math.abs(new Date(firstDate).valueOf() - new Date(secondDate).valueOf());

Comments

[drtvader]

NaN пишет, не понимаю почему вторую строку так считает.

[Yurii Nekrasov]

подправил ответ. Вместо valueOf() можете получать то значение, котрое удовлетворить условия вашей задачи. В данном случае вы получите количество миллисекунд с 01.01.1970

[drtvader]

Unknown Person: тоже NaN почему-то.

[Yurii Nekrasov]

drtvader: что пишут console.log(firstDate) и console.log(secondDate) ?

[drtvader]

Unknown Person: выводит те даты, которые ввожу.

[Yurii Nekrasov]

drtvader: будьте добры скопировать ответ в студию

[drtvader]

Unknown Person:
11.11.2016 index.html:33
15.11.2016 index.html:36
NaN

[Yurii Nekrasov]

drtvader: какую команду вы используете, что пишет NaN? Вы получаете объекты Date, когда пишете new Date(firstDate) и new Date(secondDate). Объекты создаются?

[drtvader]

Unknown Person: var timeDiff = Math.abs(new Date(firstDate).valueOf() - new Date(secondDate).valueOf()); при подсчете NaN выводит.

[drtvader]

drtvader:
var timeDiff = Math.abs(new Date(firstDate).valueOf() - new Date(secondDate).valueOf());
console.log(new Date(firstDate));
console.log(new Date(secondDate));

Wed Nov 11 2015 00:00:00 GMT+0400 (Арабское время (зима))
Invalid Date

[Yurii Nekrasov]

у вас дата не верная, поучается что 15 - это месяц, а 11 - день. Поэтому и не парсит правильно. Можно вот так new Date(Date.parse('MM.dd.YYYY'));

[Yurii Nekrasov]

drtvader: почитайте https://learn.javascript.ru/datetime

[drtvader]

Unknown Person: читал, не особо помогло. Но спасибо, буду дальше пробовать.

[Yurii Nekrasov]

drtvader: при парсинге даты вы ставите меняете местами день и месяц. И если в природе есть 11 месяц и 11 день, то 15 месяца нет. Теперь начинаете понимать? Каким образом вы устанавливаете дату в document.getElementsByClassName("firstDate")[0].value ? Вы вручную в это поле пишете 15.11.2016 ?

[drtvader]

Unknown Person: Информация задается в input, я понимаю что он считает первое число месяцем. но как это поправить я не понимаю.

[Yurii Nekrasov]

drtvader: можно распарсить строку, у вас разделитель точка. Но это костыли. У вас в input необходимо вписать дату в формате дд.мм.гггг ?

[drtvader]

ну вроде как это привычно.всегда сам так ввожу дату. Просто уже работает валидация и сравнение дат, а посчитать никак не могу.

[Yurii Nekrasov]

drtvader: вот так делаете < input ty pe ="da tetime-local" атрибуты> ? (лишние пробелы)

[drtvader]

Unknown Person: https://jsfiddle.net/drtvader/sszu90z7/ но тут почему-то не работает совсем. в отличии от локальной версии.

[Yurii Nekrasov]

drtvader: если вы хотите юзать такие костыли, тогда измените вот так для наглядности placeholder="ММ.ДД.ГГГГ" и тогда дата будет создаваться правильно. Но я бы советовал тип указывать не text, a datetime-local

[drtvader]

Unknown Person: тогда все предыдущее ломается. и такое вроде в ИЕ не работает.

[Yurii Nekrasov]

drtvader: у вас и сейчас не работает должным образом, так что выбирайте. С минимальными неудобставами указывайте дату вот так ММ.ДД.ГГГГ. Соответственно подправте валидацию

[drtvader]

Unknown Person: понял. буду править.