simple calendar - help please

[samuelberthelot]

Hi,
I've got 3 input HTML (dropdown lists) on my page. One for selecting a
Month, one for the day, one for the year. Very simple...

My problem is that I'd like to update the Days one according to what
month was selected (31,30 or 28 days). I should use a simple javascript
to populate the input boxes, but I'm a bit new to javascript.

Please can you help me ?

 

[Evertjan.]

wrote on 20 mei 2006 in comp.lang.javascript:

I've got 3 input HTML (dropdown lists) on my page. One for selecting a
Month, one for the day, one for the year. Very simple...

My problem is that I'd like to update the Days one according to what
month was selected (31,30 or 28 days). I should use a simple javascript
to populate the input boxes, but I'm a bit new to javascript.

Why do you think it is simple?
What if the user decides to set the daynumber first?
What about leap years, if the year is not selected first?

Please can you help me ?

I don't think someone here will write your code.
Try it yourself and show where you get a problem.

 

[samuelberthelot]

I don't know how to change the options of the select (the list of
items) from a javascript. I'm just asking for that bit of code. I've
already tried myself...I wouldn't post otherwise.

 

[Evertjan.]

wrote on 20 mei 2006 in comp.lang.javascript:

I don't know how to change the options of the select (the list of
items) from a javascript. I'm just asking for that bit of code. I've
already tried myself...I wouldn't post otherwise.

What are you talking about? This is usenet, so:

Please quote what you are replying to. If you want to post a followup via
groups.google.com, don't use the "Reply" link at the bottom of the article.
Click on "show options" at the top of the article, then click on the
"Reply" at the bottom of the article headers.
<http://www.safalra.com/special/googlegroupsreply/>

 

[Randy Webb]

Evertjan. said the following on 5/20/2006 7:31 AM:

wrote on 20 mei 2006 in comp.lang.javascript:

Why do you think it is simple?

Because it is simple.

What if the user decides to set the daynumber first?

Then you change the days after they change the month.

What about leap years, if the year is not selected first?

Then you deal with it when it happens.

 

[Lasse Reichstein Nielsen]

Then you deal with it when it happens.

But how will you know it happened if you changed the daynumber when
the month was set?

The coding will be simple, but deciding what should happen when isn't
/L

 

[Randy Webb]

Lasse Reichstein Nielsen said the following on 5/20/2006 1:51 PM:

But how will you know it happened if you changed the daynumber when
the month was set?

When a select gets change, you reset any select after that. It won't
take people long to figure out to fill them out in the order they appear

Rather annoying but almost fool proof.

The coding will be simple, but deciding what should happen when isn't

Actually, deciding what to do is easier than coding it.

Year changes - reset month/days select lists.
Month changes - reset days select list.
Day of Month changes - do nothing.

Then, if they skip the process then they get to start over.

This is all purely academic to me though, I despise select lists for
entering a date.

 

[Dr John Stockton]

JRS: In article <[email protected]>, dated Sat, 20
May 2006 11:31:54 remote, seen in Evertjan.

wrote on 20 mei 2006 in comp.lang.javascript:

That'll upset the Obnoxious One - not only is it longer than he likes,
but it does not identify the perpetrator!

Months in the Gregorian calendar can also have 29 days.

Why do you think it is simple?
What if the user decides to set the daynumber first?
What about leap years, if the year is not selected first?

Well, I'd expect that from an FFF user, but not from one dwelling where
EN 28601 is respected! Put the fields in the proper order Y M D, and it
will be natural to select them in that order; there will then be no
problem, even if the fields are initialised to show a short month. And
if the preset is 2000-01-01 (or Jan 1 of any other leap year) then it
seems likely that one can enter a valid date in any sequence of three or
fewer choices.

I don't think someone here will write your code.

?

Those who have read the newsgroup FAQ, frequently cited here, should
have been able to find extant code for the purpose described. A search
for 'javascript date and time', in conjunction with 'drop-down', should
also have found my js-date6.htm, which also has a selector for Year-
Week-Day, suitable for places where all weeks have seven days.

However, I find entering the date as a string matching \d+\D+\d+\D+\d+
to be appreciably quicker, and validation is easy enough for FAQ-users.

 

[Evertjan.]

Dr John Stockton wrote on 20 mei 2006 in comp.lang.javascript:

JRS: In article <[email protected]>, dated Sat,
20 May 2006 11:31:54 remote, seen in

That'll upset the Obnoxious One - not only is it longer than he likes,
but it does not identify the perpetrator!


Months in the Gregorian calendar can also have 29 days.



Well, I'd expect that from an FFF user, but not from one dwelling
where EN 28601 is respected! Put the fields in the proper order Y M
D, and it will be natural to select them in that order;

The OP specified [more or less] m d y order

there will
then be no problem, even if the fields are initialised to show a short
month. And if the preset is 2000-01-01 (or Jan 1 of any other leap
year) then it seems likely that one can enter a valid date in any
sequence of three or fewer choices.


?

Those who have read the newsgroup FAQ, frequently cited here, should
have been able to find extant code for the purpose described.

That is the same thing, I don't think we should encourage explaining how
to find ready code on the web, as it discourages IMHO programming skil
development and those codes are often years-and-years old.

A
search for 'javascript date and time', in conjunction with
'drop-down', should also have found my js-date6.htm, which also has a
selector for Year- Week-Day, suitable for places where all weeks have
seven days.

However, I find entering the date as a string matching \d+\D+\d+\D+\d+
to be appreciably quicker, and validation is easy enough for
FAQ-users.

Indeed.

A choice of both text and popup calendar is my favored one.

One has to decide the localisation order first:

dmy or mdy for local applications

ymd for the international or technical inclined.

 

[samuelberthelot]

I wanted to use text combined with a popup calendar... But my boss
doesn't want, he wants to stick with the dropdowns...
Anyway, here's a sample of how I finally did it:

<html>
<head>
<title>date</title>
<script type=text/javascript language=javascript>
function verifierjours(){
var idx=document.nomduformulaire.mois.selectedIndex;
if (idx==1) //Si on choisit février
document.nomduformulaire.jours.length=29;
else if (idx==3||idx==5||idx==8||idx==10) // si on choisit avril
ou juin ou septembre ou novembre
{ document.nomduformulaire.jours.length=30;
document.nomduformulaire.jours.options[29].text='30';
}
else { // si on choisit les autes mois
document.nomduformulaire.jours.length=31;
document.nomduformulaire.jours.options[29].text='30';
document.nomduformulaire.jours.options[30].text='31';
}
}
</script>
</head>
<body>
<form name=nomduformulaire>
<select name=mois onchange=verifierjours()>

<option>janvier</option><option>fevrier</option><option>mars</option><option>avril</option>

<option>mai</option><option>juin</option><option>juillet</option><option>aout</option>

<option>septembre</option><option>octobre</option><option>novembre</option><option>decembre</option>
</select>
<select name=jours>

<option>01</option><option>02</option><option>03</option><option>04</option><option>05</option>

<option>06</option><option>07</option><option>08</option><option>09</option><option>10</option>

<option>11</option><option>12</option><option>13</option><option>14</option><option>15</option>

<option>16</option><option>17</option><option>18</option><option>19</option><option>20</option>

<option>21</option><option>22</option><option>23</option><option>24</option><option>25</option>

<option>26</option><option>27</option><option>28</option><option>29</option><option>30</option><option>31</option>
</select>
</form>
</body>
</html>

 

[Evertjan.]

wrote on 21 mei 2006 in comp.lang.javascript:

I wanted to use text combined with a popup calendar... But my boss
doesn't want, he wants to stick with the dropdowns...
Anyway, here's a sample of how I finally did it:

<html>
<head>
<title>date</title>
<script type=text/javascript language=javascript>
function verifierjours(){
var idx=document.nomduformulaire.mois.selectedIndex;
if (idx==1) //Si on choisit f‚vrier
document.nomduformulaire.jours.length=29;

It still does not address the non-leap-year 29 febr.

In the mean time your going is good.

I would show an dynamic text result next to the drop-down lists.

 

[Dr John Stockton]

JRS: In article <[email protected]>,
dated Sun, 21 May 2006 05:29:58 remote, seen in

function verifierjours(){
var idx=document.nomduformulaire.mois.selectedIndex;
if (idx==1) //Si on choisit février
document.nomduformulaire.jours.length=29;
else if (idx==3||idx==5||idx==8||idx==10) // si on choisit avril
ou juin ou septembre ou novembre
{ document.nomduformulaire.jours.length=30;
document.nomduformulaire.jours.options[29].text='30';
}
else { // si on choisit les autes mois
document.nomduformulaire.jours.length=31;
document.nomduformulaire.jours.options[29].text='30';
document.nomduformulaire.jours.options[30].text='31';
}
}

Given the language used within your code, you would certainly be ill-
advised to use M D Y; and your users should be intelligent enough to
handle Y M D even if their instinct is for D M Y. Unless you are from
PQ.

Once Y and M are selected, the length of D is readily determined by

new Date(Y, M, 0).getDate()
new Date(Date.UTC(Y, M, 0)).getUTCDate() // faster

See via sig below.