0

I need to get the dates of the next 3 months of thursdays, and then output those dates into a select input, with the value formatted as dd/mm/yyyy but the choice showing as "Thursday 12th April 2021", ideally in jQuery, but PHP would be ok also.

<select>
    <option value="08/04/2021">Thursday 8th April 2021</option>
    <option value="15/04/2021">Thursday 15th April 2021</option>
    <option value="22/04/2021">Thursday 22nd April 2021</option>
    etc
    etc
</select>

I found this jsfiddle that gets all the thursdays of the current month, but I need it to be the NEXT 3 months of thursdays, starting from today's date. (and including today if today is a Thursday).

It would be ok if it's the next 12 thursdays from today's date.

user2115227
  • 147
  • 2
  • 9
  • 24
  • I would look at a similar post (this one gets Monday's) https://stackoverflow.com/questions/34979051/find-next-instance-of-a-given-weekday-ie-monday-with-moment-js – hppycoder Apr 05 '21 at 19:50
  • 1
    This is really a number of questions: add 3 months to a Date, get the next Thursday, add a week (7 days) to a Date, format a date as dd/mm/yyyy and how to add options to a select. You need to add some code to show how you're doing some of that at least. jQuery and PHP are entirely different languages, so you should also pick which one you want to use (probably PHP if client/server timezone differences aren't an issue). – RobG Apr 05 '21 at 22:03
  • See [*Get next week's date of a certain day in JavaScript*](https://stackoverflow.com/questions/43582087/get-next-weeks-date-of-a-certain-day-in-javascript), [*JavaScript add day(s)*](https://stackoverflow.com/questions/11734926/javascript-add-days), [*JavaScript function to add X months to a date*](https://stackoverflow.com/questions/2706125/javascript-function-to-add-x-months-to-a-date). – RobG Apr 05 '21 at 22:08

1 Answers1

1

To get the next X months, you could do:

function getNextMonths(num, include_current = false) {

    let current = new Date();
    let months  = [];

    if (include_current) {

        months.push(current);
        num--;
    }

    for (let i = 1; i <= num; i++) {

        let next = new Date();

        next.setDate(1);
        next.setMonth(current.getMonth() + i);

        months.push(next);
    }

    return months;
}

console.log(getNextMonths(3)); // Gives you the next three months

From there, you just need to loop the months & evaluate their days:

function getDayOfWeek(num_week_day, dates) {

    let days = [];

    for (let i = 0; i < dates.length; i++) {

        // Evaluate current month
        
        let current = {

            year: dates[i].getFullYear(),
            month: dates[i].getMonth()
        };

        current.days = new Date(current.year, current.month + 1, 0).getDate();
        
        // Loop & evaluate days 
        
        for (let d = 1; d <= current.days; d++) {

            let date = new Date(current.year, current.month, d);

            if (date.getDay() == num_week_day) {

                days.push(date);
            }
        }
    }

    return days;
}

// Get all Thursdays (4th day of the week) within the next 3 months.
console.log(getDayOfWeek(4, getNextMonths(3))); 

// Get Thursdays within the next 3 months including the current one
console.log(getDayOfWeek(4, getNextMonths(3, true))); 

// Get Thursdays within the next 3 months including the current one...
let thursdays = getDayOfWeek(4, getNextMonths(3, true));

//...but keep only those Thursdays that are in the future  
let today    = new Date();
let filtered = thursdays.filter(function (date) {

    return date.getTime() >= today.getTime();
});

console.log(thursdays, filtered);

Both functions return an array of Date objects - you might need to format those according to your needs. See this thread for different approaches on how to do that:

As already pointed out in the comments by referencing this thread, you also might want to consider moment.js for JavaScript date operations.

nosurs
  • 680
  • 6
  • 13
  • Thanks. How would I take that array and put it into a select box? – user2115227 Apr 06 '21 at 07:17
  • Walking an array is pretty basic stuff, so you'd be able to pick it up in no time. Same goes for [how to build HTML elements using JavaScript](https://stackoverflow.com/questions/5536596/dynamically-creating-html-elements-using-javascript). You already have all the moving parts on how to use date objects for your purposes from the example you have cited, my answer, and the references RobG, hppycoder, and I've linked, so I'd take it from there. – nosurs Apr 06 '21 at 08:51
  • Thanks. The code you suggested returns the NEXT 3 months, maybe I didn't explain, but it should be the next 3 months worth of thursdays, starting from the current date's month. So for example, it would return all of April, May and June Thursdays (excluding any previous Thursdays from today's date) if ran today. – user2115227 Apr 06 '21 at 09:30
  • I've managed to include this month by changing the i =1 to i=0 in the getNextMonths(), however I'm not sure how to only output thursdays FROM todays date, not before? – user2115227 Apr 06 '21 at 09:51
  • I've updated the code so you can now include the current month (works more or less the same way you already figured out). Also, I included an example on how you might filter the dates - currently, it would give you every _upcoming_ Thursday within the next three months including the current one. – nosurs Apr 06 '21 at 11:21