Thursday, February 8, 2007

Javascript Local Date Function

function local_date () {

startoffset = 3;
duration = 7;
servertz = -5;

theday = new Date ();
theday2 = new Date ();

theyearfirst = document.form1.gciy.options[0].value;
thetz = theday.getTimezoneOffset ();

epoch = theday.getTime () + (24 * 3600 * startoffset + 60 * thetz + 3600 * servertz) * 1000;

theday.setTime (epoch);
thedate = theday.getDate ();
themonth = theday.getMonth () + 1;
theyear = theday.getFullYear ();

theyearoffset = theyear - theyearfirst;

document.form1.gcid.options[thedate].selected = true;
document.form1.gcim.options[themonth].selected = true;
document.form1.gciy.options[theyearoffset].selected = true;

epoch2 = epoch + 24 * 3600 * duration * 1000;

theday2.setTime (epoch2);
thedate2 = theday2.getDate ();
themonth2 = theday2.getMonth () + 1;
theyear2 = theday2.getFullYear ();

theyearoffset2 = theyear2 - theyearfirst;

document.form1.gcod.options[thedate2].selected = true;
document.form1.gcom.options[themonth2].selected = true;
document.form1.gcoy.options[theyearoffset2].selected = true;

}

Copy and paste code above into text editor, save it with name local_date.js.
Do the same thing with code below but name it with local_date.html and put at the same directory with local_date.js.

<html>
<head>
<title>Javascript Local Date Function</title>
<script language="javascript" src="local_date.js"></script>
</head>
<body>
<form name="form1">
<table border=0 cellpadding=0 cellspacing=0 cols=3>
<tr>
<td>Check in three days after now</td>
<td width="5px">:</td>
<td>
<select name=gcid id=gcid>
<option>------ </option>
<option value=1>1 </option>
<option value=2>2 </option>
<option value=3>3 </option>
<option value=4>4 </option>
<option value=5>5 </option>
<option value=6>6 </option>
<option value=7>7 </option>
<option value=8>8 </option>
<option value=9>9 </option>
<option value=10>10 </option>
<option value=11>11 </option>
<option value=12>12 </option>
<option value=13>13 </option>
<option value=14>14 </option>
<option value=15>15 </option>
<option value=16>16 </option>
<option value=17>17 </option>
<option value=18>18 </option>
<option value=19>19 </option>
<option value=20>20 </option>
<option value=21>21 </option>
<option value=22>22 </option>
<option value=23>23 </option>
<option value=24>24 </option>
<option value=25>25 </option>
<option value=26>26 </option>
<option value=27>27 </option>
<option value=28>28 </option>
<option value=29>29 </option>
<option value=30>30 </option>
<option value=31>31 </option>
</select>
-
<select name=gcim id=gcim>
<option>------ </option>
<option value=1>January </option>
<option value=2>February </option>
<option value=3>March </option>
<option value=4>April </option>
<option value=5>May </option>
<option value=6>June </option>
<option value=7>July </option>
<option value=8>August </option>
<option value=9>September </option>
<option value=10>October </option>
<option value=11>November </option>
<option value=12>December </option>
</select>
-
<select name="gciy" id="gciy">
<script type="text/javascript">
var date = new Date();
var year = date.getFullYear();
var option = "";
for (i=year; i<=year+4; i++) {
option += "<option value=\""+i+"\">"+i+"</option>";
}
document.write(option);
</script>
</select>
</td>
</tr>
<tr>
<td>Check out seven days after check in</td>
<td width="5px">:</td>
<td>
<select name=gcod id=gcod>
<option>------ </option>
<option value=1>1 </option>
<option value=2>2 </option>
<option value=3>3 </option>
<option value=4>4 </option>
<option value=5>5 </option>
<option value=6>6 </option>
<option value=7>7 </option>
<option value=8>8 </option>
<option value=9>9 </option>
<option value=10>10 </option>
<option value=11>11 </option>
<option value=12>12 </option>
<option value=13>13 </option>
<option value=14>14 </option>
<option value=15>15 </option>
<option value=16>16 </option>
<option value=17>17 </option>
<option value=18>18 </option>
<option value=19>19 </option>
<option value=20>20 </option>
<option value=21>21 </option>
<option value=22>22 </option>
<option value=23>23 </option>
<option value=24>24 </option>
<option value=25>25 </option>
<option value=26>26 </option>
<option value=27>27 </option>
<option value=28>28 </option>
<option value=29>29 </option>
<option value=30>30 </option>
<option value=31>31 </option>
</select>
-
<select name=gcom id=gcom>
<option>------ </option>
<option value=1>January </option>
<option value=2>February </option>
<option value=3>March </option>
<option value=4>April </option>
<option value=5>May </option>
<option value=6>June </option>
<option value=7>July </option>
<option value=8>August </option>
<option value=9>September </option>
<option value=10>October </option>
<option value=11>November </option>
<option value=12>December </option>
</select>
-
<select name="gcoy" id="gcoy">
<script type="text/javascript">
var date = new Date();
var year = date.getFullYear();
var option = "";
for (i=year; i<=year+4; i++) {
option += "<option value=\""+i+"\">"+i+"</option>";
}
document.write(option);
</script>
</select>
</td>
</tr>
</table>
</form>
<script>local_date();</script>
<p>
<center>
© <script type="text/javascript">document.write(new Date().getFullYear())</script> <a href="http://muntenari.com">muntenari.com</a>
</center>
</body>
</html>

The code above will look like form in my website muntenari.com

Happy Coding,
muntenari.com

No comments: