If this is your first visit, be sure to
check out the FAQ by clicking the
link above. You may have to register
before you can post: click the register link above to proceed. To start viewing messages,
select the forum that you want to visit from the selection below.

Fortnightly date cycle

Hi,
I have a web form with a date input (actually 3 inputs [dd] / [mm] / [yyyy] - though I'm happy to make it one input box).
The form is used to enter a roster. Rosters begin every wednesday and are a fortnight long.

So I'd like a button of some kind next to the input which says "next". So if the date 18/03/2009 (dd/mm/yyyy) is in the box, and the "next" button is pressed, the date changes to 25/03/2009.

In addition, when you first open the page, the date box is blank, so I'd like to automatically populate that field with the next wednesday which falls into the fortnightly cycle.

I'm thinking something along the lines of: give the JS a start date, then it just counts up in fornightly increments until it gets PAST the current date - then populate the field with that date - then the "next" button would just add 2 weeks to the date already in the input field.

(In there somewhere id also like some validation in case the user enters their own random date)

Unfortunately, my programming is usually in php, and so im a TOTAL noob when it comes to javascript... any help would be great!

**Just so you know, im posting this form to google calendar which automatically syncs with my iphone!! L33t!! Haha...

Still, I don't understand what do you mean by fortnight. The way you have put the problem, you need to display the next Wednesday in a field and the next-next Wednesday in the other. This not quite a fortnight (2 weeks)...

Need fortnightly start date!

I've had a play with what you wrote and we're getting really close!

I've made the code add 14 days, not seven, and now it updates the original field. So its just about perfect! (see below)

The only thing left to do is determine the start date. Currently, it just finds the next wednesday after today. But I'm on a fortnightly roster, so it needs to find the next wednesday which starts a roster cycle.

For example, if my roster cycle starts today (18 March), then I'd like it display 18/03/09 in the input. If I looked at this page yesterday, it should still display 18/03/09 - as that is the beginning of the next roster cycle. If I look at this page tomorrow, id like it to display 01/04/09 - as that is the beginning of the next fortnight's roster... and so on into the future.

Finished!

Well, thanks to Kor, I have adapted his script and come up with a working version that meets all my specifications!

Thanks Kor!

Feel free to use this however you want! I've commented everywhere so you can see exactly whats happening and where! Enjoy!

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>untitled</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta http-equiv="Content-Style-Type" content="text/css">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<script type="text/javascript">
function setNextCycleStartDate(){//Generate first roster start date after today
var cycleStartDate=new Date();//Make new date variable
cycleStartDate.setFullYear(2009,1,25);//Set that variable with ANY roster cycle start date from the past
var today=new Date();//Get todays date
while(cycleStartDate<=today){//Whenever the old roster start date is less than today
cycleStartDate.setDate(cycleStartDate.getDate()+14);//Add a fortnight to it, until it is a date in the future
}
writeDate(cycleStartDate,'dateInput');//Send that date to the form date input field
}
function nextFortnight(f){//Generate the next roster start date after the one already entered
var d=f['dateInput'].value.split('/');//Split up the date so it can be manipulated
var date=new Date(Number(d[2]),Number(d[1])-1,Number(d[0]));//Do some stuff
date.setDate(date.getDate()+14);//Add 14 days (a fortnight) to the date
writeDate(date,'dateInput');//Send that date to the writeDate function for sending to the form
}
function prevFortnight(f){//Generate the previoust roster start date before the one already entered
var d=f['dateInput'].value.split('/');//Split up the date so it can be manipulated
var date=new Date(Number(d[2]),Number(d[1])-1,Number(d[0]));//Do some stuff
date.setDate(date.getDate()-14);//Subtract 14 days (a fortnight) from that date
writeDate(date,'dateInput');//Send that date to the writeDate function for sending to the form
}
function writeDate(date,fname){//Change the date into a readable format, and in dd/mm/yyyy, write that date to the form
var DT=date.getDate();
var YYYY=date.getFullYear();
var MM=date.getMonth()+1;
DT<10?DT='0'+DT:null;MM<10?MM='0'+MM:null;
var f=document.getElementById('gCalForm');
f[fname].value=DT+'/'+MM+'/'+YYYY;
}
onload=setNextCycleStartDate;
</script>
</head>
<body>
<form action="" id="gCalForm">
<input type="text" name="dateInput" readonly="readonly"><input type="button" value="Next" onclick="nextFortnight(this.form)"><input type="button" value="Prev" onclick="prevFortnight(this.form)"><input type="button" value="Reset" onclick="setNextCycleStartDate(this.form)">
</form>
</body>
</html>