let inputDate = document.querySelector(".inputDate"),
  submit = document.querySelector(".submit"),
  currentDate = document.querySelector(".currentDate"),
  dateAfter = document.querySelector(".dateAfter"),
  futureDays = document.querySelector(".futureDays");

submit.onclick = (e) => {
  e.preventDefault;
  futureDays.innerText = "";

  let newDate = new Date(inputDate.value);

  let something = newDate / 1000;
  let something2 = new Date(something * 1000);
  let firstDate =
    something2.getDate()  
    "-"  
    (something2.getMonth()  
    1 ) 
    "-"  
    something2.getFullYear();
  

  let inSeconds = Math.floor(newDate.getTime() / 1000);

  let myArr = [];

  for (let i = 0; i < 5; i  ) {
    let sixDays = Math.floor((newDate.setDate(newDate.getDate()   7) / 1000));
    
    let newDateFormat = new Date(sixDays * 1000);
    myArr.push(
      "  "  
        newDateFormat.getDate()  
        "-"  
        (newDateFormat.getMonth()   1)  
        "-"  
        newDateFormat.getFullYear()  
        "  "
    );
    // myArr.push(sixDays);
    futureDays.innerText = myArr;
  }
};

<input type="date" name="" id=""  data-date-format="DD MMMM YYYY">
<button >Submit</button>
<div ></div>
<div ></div>
<div ></div>

I am trying to get the next 5 dates after a particular date ( user provided ) with a gap of 7 days in between. I was able to get the next 5 dates and store them in an array, however I am unable to get the first date that was user selected in the array.

JS:

submit.onclick = (e) => {

  e.preventDefault;
  futureDays.innerText = "";

  let newDate = new Date( inputDate.value );
  
// First Date
  let something = newDate / 1000;
  let something2 = new Date(something * 1000);
  let firstDate =
    something2.getDate()  
    "-"  
    (something2.getMonth()  
    1 ) 
    "-"  
    something2.getFullYear();
  

  let myArr = [];

  for ( let i = 0; i < 5; i   ) {

    let sixDays = Math.floor( ( newDate.setDate(newDate.getDate()   7 ) / 1000 ) );
    
    let newDateFormat = new Date( sixDays * 1000 );
    myArr.push(
      "  "  
        newDateFormat.getDate()  
        "-"  
        (newDateFormat.getMonth()   1)  
        "-"  
        newDateFormat.getFullYear()  
        "  "
    );

    futureDays.innerText = firstDate   myArr;
  }
};

The first date comment, in this I am able to get the first date ( user provided ) and was able to add it in the array, but is there a way that by default the user selected date is included in the array.

CodePudding user response：

You can specify it as the array element when you initialize the array, like:

let myArr = [inputDate.value];

let inputDate = document.querySelector(".inputDate"),
  submit = document.querySelector(".submit"),
  currentDate = document.querySelector(".currentDate"),
  dateAfter = document.querySelector(".dateAfter"),
  futureDays = document.querySelector(".futureDays");

submit.onclick = (e) => {
  e.preventDefault;
  futureDays.innerText = "";

  let newDate = new Date(inputDate.value);

  let something = newDate / 1000;
  let something2 = new Date(something * 1000);
  let firstDate =
    something2.getDate()  
    "-"  
    (something2.getMonth()  
    1 ) 
    "-"  
    something2.getFullYear();
  

  let inSeconds = Math.floor(newDate.getTime() / 1000);

  let myArr = [inputDate.value];

  for (let i = 0; i < 5; i  ) {
    let sixDays = Math.floor((newDate.setDate(newDate.getDate()   7) / 1000));
    
    let newDateFormat = new Date(sixDays * 1000);
    myArr.push(
      "  "  
        newDateFormat.getDate()  
        "-"  
        (newDateFormat.getMonth()   1)  
        "-"  
        newDateFormat.getFullYear()  
        "  "
    );
    // myArr.push(sixDays);
    futureDays.innerText = myArr;
  }
};

<input type="date" name="" id=""  data-date-format="DD MMMM YYYY">
<button >Submit</button>
<div ></div>
<div ></div>
<div ></div>

CodePudding user response：

// using date-fns for ease

import { addDays } from 'date-fns';

const startDate = new Date(); // or user provided date
let daysNeeded = [];
const gap = 5;

daysNeeded.push(startDate);
for(let i = 1;  i<=5 ; i  ) {
  daysNeeded.push(dateFns.addDays(startDate , i   gap))
}

console.log('days', daysNeeded);