...

View Full Version : New to javascript



Lexilou
12-11-2007, 04:02 PM
Hi all,

I am new to the boards and new to Javascript and I am looking for some help for on a Date Difference Calculator. I have already created the basics of the page where you can enter the month, day and year but I am not sure who to do the actual script to have it calculate the difference between the two dates. I have named my function dateDiff and want the return to be in a alert box.

Can anyone help out?

Thank you,

LL

Kor
12-11-2007, 04:06 PM
The difference in what? In days? In weeks+days? In years+months+days?

Lexilou
12-11-2007, 04:14 PM
Sorry about that, I want the difference in the amount of days.

Thank you,

LL

Philip M
12-11-2007, 04:47 PM
Here you are:-

<script type = "text/javascript">

function dateDiff() {

t1="10/10/2005" ; // 10th October 2005
t2="15/12/2007"; // 15th December 2007

var one_day=1000*60*60*24;
var x=t1.split("/");
var y=t2.split("/");
//date format(Fullyear,month,date)
var date1=new Date(x[2],(x[1]-1),x[0]);
var date2=new Date(y[2],(y[1]-1),y[0])
var month1=x[1]-1;
var month2=y[1]-1;
var Diff=Math.ceil((date2.getTime()-date1.getTime())/(one_day));
alert (Diff + " days");

}

</script>

Lexilou
12-11-2007, 05:10 PM
Ok not sure what I am messing up, as I said I am new to this.

here is my original code

<HEAD>

<SCRIPT LANGUAGE="JavaScript">
<!-- Begin

function dateDiff(firstmonth, firstday, firstyear, secondmonth, secondday, secondyear)
{

alert ("There are " + days + " days between the dates");
}
// End -->
</script>
</HEAD>


<BODY>

<center>
<form name=dateform>
<table>
<tr><td>
<pre>
First Date: Month: <input type=text name=firstmonth value="" size=10 maxlength=10>
Day: <input type=text name=firstday value="" size=10 maxlength=10>
Year: <input type=text name=firstyear value="" size=10 maxlength=10>

Second Date: Month: <input type=text name=secondmonth value="" size=10 maxlength=10>
Day: <input type=text name=secondday value="" size=10 maxlength=10>
Year: <input type=text name=secondyear value="" size=10 maxlength=10>

<center><input type=button value="Calculate Difference in days!"
onclick="dateDiff(firstmonth.value, firstday.value, firstyear.value, secondmonth.value,
secondday.value, secondyear.value);">

</center>
</pre>
</td></tr>
</table>
</form>
</center>



And here is what I added to the code per your suggestion

HEAD>

<SCRIPT LANGUAGE="JavaScript">
<!-- Begin

function dateDiff(firstmonth, firstday, firstyear, secondmonth, secondday, secondyear)

{

t1="10/10/2007" ; // 10th October 2007
t2="15/12/2007"; // 15th December 2007

var one_day=1000*60*60*24;
var x=t1.split("/");
var y=t2.split("/");
//date format(Fullyear,month,date)
var date1=new Date(x[2],(x[1]-1),x[0]);
var date2=new Date(y[2],(y[1]-1),y[0])
var month1=x[1]-1;
var month2=y[1]-1;
var Diff=Math.ceil((date2.getTime()-date1.getTime())/(one_day));
alert (Diff + " days");;
}
// End -->
</script>
</HEAD>


<BODY>

<center>
<form name=dateform>
<table>
<tr><td>
<pre>
First Date: Month: <input type=text name=firstmonth value="" size=10 maxlength=10>
Day: <input type=text name=firstday value="" size=10 maxlength=10>
Year: <input type=text name=firstyear value="" size=10 maxlength=10>

Second Date: Month: <input type=text name=secondmonth value="" size=10 maxlength=10>
Day: <input type=text name=secondday value="" size=10 maxlength=10>
Year: <input type=text name=secondyear value="" size=10 maxlength=10>

<center><input type=button value="Calculate Difference in days!"
onclick="dateDiff(firstmonth.value, firstday.value, firstyear.value, secondmonth.value,
secondday.value, secondyear.value);">

</center>
</pre>
</td></tr>
</table>
</form>
</center>

I am still lost. Thank you all for your help so far, I really do appreciate it.

Philip M
12-11-2007, 05:54 PM
<HTML>
<HEAD>

<script type = "text/javascript">
<!-- Begin

function dateDiff() {

t1 = document.dateform.firstDate.value;
t2 = document.dateform.secondDate.value;

var one_day=1000*60*60*24;
var x=t1.split("/");
var y=t2.split("/");
//date format(Fullyear,month,date)
var date1=new Date(x[2],(x[1]-1),x[0]);
var date2=new Date(y[2],(y[1]-1),y[0])
var month1=x[1]-1;
var month2=y[1]-1;
var Diff=Math.ceil((date2.getTime()-date1.getTime())/(one_day));
alert (Diff + " days");;
}
// End -->
</script>
</HEAD>

<BODY>

<center>
<form name="dateform">
<table>
<tr><td>
<pre>
Enter the first date in DD/MM/YYYY format<input type="text" name="firstDate" value="" size="10" maxlength="10">

Enter the second date in DD/MM/YYYY format <input type="text" name="secondDate" value="" size="10" maxlength="10">

<center><input type = "button" value = "Calculate Difference in days!" onclick="dateDiff()">
</pre>
</td></tr>
</table>
</form>
</center>

</BODY>
</HTML>

You will need to add validation to check that the dates as entered are valid (not something like 45/27/5008 or even 31/02/2007) and that the second date comes after the first (Actually it works if date2 is before date1).

Arty Effem
12-12-2007, 05:28 AM
Hi all,

I am new to the boards and new to Javascript and I am looking for some help for on a Date Difference Calculator. I have already created the basics of the page where you can enter the month, day and year but I am not sure who to do the actual script to have it calculate the difference between the two dates. I have named my function dateDiff and want the return to be in a alert box.

Can anyone help out?
Please be advised that no matter how often you see it done - it is a fatal error to use time functions to calculate dates. There will be circumstances when daylight saving transitions introduce an error.
There are complicated ways of doing it efficiently, however here is a simple albeit slow algorithm for simply counting the days. There is no error checking:


function DateDiff(d1,d2)
{
var dt1=new Date(d1), dt2=new Date(d2), i=0,

date2={day:dt2.getDate(), month:dt2.getMonth(), year:dt2.getFullYear() };

while( dt1.getFullYear() != date2.year)
{
dt1.setDate(dt1.getDate()+1);
i++
}
while( dt1.getMonth() != date2.month)
{
dt1.setDate(dt1.getDate()+1);
i++
}
while( dt1.getDate() != date2.day)
{
dt1.setDate(dt1.getDate()+1);
i++
}

alert(i+' day'+(i!=1?"s":"") );
}

DateDiff("oct 10 2006", "dec 15 2007");

Philip M
12-12-2007, 07:52 AM
"There will be circumstances when daylight saving transitions introduce an error."

Really? How so? How can a date expressed in days (not hours) be affected by daylight saving?

Lexilou is new to the boards and new to Javascript. He is looking for a (comparatively simple) script that he can understand and apply. I have mentioned before that a good teacher operates at the level of the student. I have to say that I feel that it is inappropriate to offer graduate-level solutions to beginners, especially without any explanation. Otherwise there is a sense that the motivaton is not so much to really help the student but rather to say "look how remarkably clever I am!".

Kor
12-12-2007, 11:15 AM
"There will be circumstances when daylight saving transitions introduce an error."

Really? How so? How can a date expressed in days (not hours) be affected by daylight saving?
Simple... If you don't specify the hour, the Date() object will take 0 hours as default. Now, if you try to find how many days are between Saturday before DST and Sunday after DST, if you may find 0 days or 1 day, according to the fact that you will count or not that DST hour...

Philip M
12-14-2007, 07:20 PM
Simple... If you don't specify the hour, the Date() object will take 0 hours as default. Now, if you try to find how many days are between Saturday before DST and Sunday after DST, if you may find 0 days or 1 day, according to the fact that you will count or not that DST hour...

Sorry, Kor. With all due respect, I am unable to see what you are driving at. I have tested my script with 27/10/2007 and 28/10/2007, also 24/03/2007 and 25/03/2007. In each case I get the correct answer - 1 day. I do not see how any other result could possibly arise.

In the UK summer time begins/ends at 0100 GMT. So 0000 hours are not duplicated.

Kor
12-14-2007, 09:21 PM
You misunderstood me... I have not criticized your code. I was to say that, when simply use a math add in building a calendar, the result might be not the one you expect for. The safe way is to use Date() associated methods, even in a loop (because they stand by the internal CU clock), than to calculate in milliseconds, split in years/months/... whichever, and display the result later.

I was thinking on:
"Really? How so? How can a date expressed in days (not hours) be affected by daylight saving?"
Well, yes, it will affect if you calculate in days as 24*60*60*1000 milliseconds, you will get the wrong answer. It is not the case of your code (at least not at my first glance). I meant only your too short note about the DST... It is important, you know...:)

Philip M
12-15-2007, 08:25 AM
Yes, I accept what you say, but the issue of DST has no relevance to this thread or to the question asked.

I accept that errors can possibly arise with calendars etc., but when expressed in days the difference bewteen two dates is not affected even if one day has 23 or 25 hours due to DST.

As I say, Lexilou is new to the boards and new to Javascript. He is looking for a (comparatively simple) script that he can understand and apply. I have mentioned before that a good teacher operates at the level of the student. I have to say that I feel that it is inappropriate to offer graduate-level solutions to beginners, especially without any explanation.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum