View Full Version : Javascript drop down menu for years past and future

12-29-2010, 12:43 AM
I am trying to create a drop down menu for dates that starts with today's date, but allows people to choose 50 years into the past and 10 years into the future.

Here's what I have for the years:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Untitled Document</title>

<h4>Select a date to see the energies for that day
<script type="text/javascript">
var mesparaluna=['Jan','Feb','Mar','Apr','May','Jun','Jul','Aug','Sept','Oct','Nov','Dec'];

function populatedropdown(mesparaluna, diaparaluna, axxa1){
var today=new Date()
var mesparaluna=document.getElementById(mesparaluna)
var diaparaluna=document.getElementById(diaparaluna)
var axxa1=document.getElementById(axxa1)
for (var i=0; i<31; i++)
diaparaluna.options[i]=new Option(i, i+1)
diaparaluna.options[today.getDate()]=new Option(today.getDate(), today.getDate(), true, true) //select today's day

for (var m=0; m<12; m++)
mesparaluna.options[m]=new Option(mesparaluna[m], mesparaluna[m]+1)
mesparaluna.options[today.getMonth()]=new Option(today.getMonth(), today.getMonth(), true, true) //select today's month

var thisyear=today.getFullYear()

for (var y=0; y<20; y++){
axxa1.options[y]=new Option(thisyear, thisyear)
axxa1.options[0]=new Option(today.getFullYear(), today.getFullYear(), true, true) //select today's year


<SCRIPT SRC=tzolkin.js></script>


<p><font size="2" face="Verdana">
<SELECT class="input_tex" name=mesparaluna id="mesparaluna"></SELECT> &nbsp;</font>
<SELECT class="input_tex" name="diaparaluna" id="diaparaluna"></SELECT>&nbsp;&nbsp;</font>
<SELECT class="input_tex" name="axxa1" id="axxa1"></SELECT></p>

<p><INPUT class="input_tex" onclick="sacakinpersonal()" type="button" value="Search"><img border="0" name="pirav" src="blanco.gif" class="shakeimage" width="10" height="10">
<INPUT class="input_tex" onclick="sacakindias()" type="button" value="Today"></p></form>
<script type="text/javascript">

//populatedropdown(id_of_day_select, id_of_month_select, id_of_year_select)
populatedropdown("diaparaluna", "mesparaluna", "axxa1")

I am also having a problem with the month. I wanted it to show the name of the month, but I am getting a number (and a wrong one at that).

Apologies... I am a terrible newbie with Javascript.

Old Pedant
12-29-2010, 12:54 AM

var thisyear = today.getFullYear()
// 50 years in past to 10 in future:
for (var yr= thisyear-50; yr <= thisyear + 10; yr++ )
axxa1.options[axxa1.options.length] = new Option(yr, yr);
axxa1.selectedIndex = 50; // thisyear *WILL* be at option 50


Or another way:


var thisyear = today.getFullYear() - 50; // start 50 years in the past
// 50 years in past to 10 in future will be 61 years total:
for (var yr= 0; yr < 61; yr++, thisyear++ )
axxa1.options[yr] = new Option(thisyear, thisyear);
axxa1.selectedIndex = 50; // current year *WILL* be at option 50


And there are several other ways.

12-29-2010, 02:08 AM
absolutely perfect on the fix for the years! Many mucho thanks!!!

Any thoughts about what I am doing wrong on my months? I am getting the number 11 for today's date and the other options in my drop down are "null."

Here's (http://mayankin.com/tzolkin/date5.html) what it's looking like.

Old Pedant
12-29-2010, 02:34 AM
Months in JavaScript go from 0 to 11, *NOT* from 1 to 12. Please don't ask why. It's buried in the annals of history.