this code cant work in firefox.. and my day auto reset... HELP !

alvinchua · February 6, 2008

hi ppl ... this is my code and it cant work in firefox browser ... the error is on the month february either appear to be in 28 days or 29...

it will only display default value which is 31 days... and after i select a day .. i go and select a month .. the day value will be auto reset back to value 1 (which is the starting date)

thanks in advance... and this is my code..


<script language="javascript">
function SelectMonth(what)
{
var months = "01";
months = document.getElementById("selectMonth").value;
if (months == "04" || months == "06" || months == "09" || months == "11") {
document.getElementById("selectDay").innerHTML="<SELECT name='day'><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></SELECT>";
}

else if (months == "02") 
{
var year= document.getElementById("SelectYear").value

alert(year);
parseInt('year')
if
 ((year % 4 == 0) || (year % 100 == 0) || (year % 400 == 0)){

document.getElementById("selectDay").innerHTML="<SELECT name='day'><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></SELECT>";
}
else
{
document.getElementById("selectDay").innerHTML="<SELECT name='day'><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>";
}

}
else {
document.getElementById("selectDay").innerHTML="<SELECT name='day'><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>";
}
}

function SelectedDay(y){
var dayselect = document.getElementById("selectDay").value
alert(dayselect);
}

function SelectYear(y){
var yearselect = document.getElementById("selectDay").value
var months = "01";
months = document.getElementById("selectMonth").value;
if (months == "02") 
{
var year= document.getElementById("SelectYear").value

alert(year);
parseInt('year')
if
 ((year % 4 == 0) || (year % 100 == 0) || (year % 400 == 0)){

document.getElementById("selectDay").innerHTML="<SELECT name='day'><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></SELECT>";
}
else
{
document.getElementById("selectDay").innerHTML="<SELECT name='day'><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>";
}
}
}


</script>
<form action="">
<SELECT name='month' id='selectMonth' onChange='SelectMonth(this.value)'>
	<OPTION VALUE="01">January</OPTION>
	<OPTION VALUE="02">February</OPTION>
	<OPTION VALUE="03">March</OPTION>
	<OPTION VALUE="04">April</OPTION>
	<OPTION VALUE="05">May</OPTION>
	<OPTION VALUE="06">June</OPTION>
	<OPTION VALUE="07">July</OPTION>
	<OPTION VALUE="08">August</OPTION>
	<OPTION VALUE="09">September</OPTION>
	<OPTION VALUE="10">October</OPTION>
	<OPTION VALUE="11">November</OPTION>
	<OPTION VALUE="12">December</OPTION>
</SELECT>
<span id="selectDay">
	<SELECT name='day' onChange='SelectedDay(this.value)'>
	<OPTION VALUE="01" >1</OPTION>
	<OPTION VALUE="02">2</OPTION>
	<OPTION VALUE="03">3</OPTION>
	<OPTION VALUE="04">4</OPTION>
	<OPTION VALUE="05">5</OPTION>
	<OPTION VALUE="06">6</OPTION>
	<OPTION VALUE="07">7</OPTION>
	<OPTION VALUE="08">8</OPTION>
	<OPTION VALUE="09">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>
</span>

<SELECT name='year' id='selectYear' onchange ='SelectYear(this.value)'>
	<OPTION VALUE="2008" SELECTED >2008</OPTION>
	<OPTION VALUE="2009">2009</OPTION>
	<OPTION VALUE="2010">2010</OPTION>
	<OPTION VALUE="2011">2011</OPTION>
	<OPTION VALUE="2012">2012</OPTION>
	<OPTION VALUE="2013">2013</OPTION>
	<OPTION VALUE="2014">2014</OPTION>
	<OPTION VALUE="2015">2015</OPTION>

</SELECT>

phpQuestioner · February 6, 2008

If you had left the script alone; left it like the way I originally wrote it; it would be working fine right now.

nogray · February 7, 2008

You better use some math and loops for making the options. Writing a gaint select menu with innerHTML is impractical.

Here is a full working version

<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script language="javascript">
function daysInMonth(mnt, yr){
	var mnt = mnt-1;
	var dt = new Date(yr, mnt, 28);
	for (i=28; i<=32; i++){
		dt.setDate(i);
		if (mnt != dt.getMonth()){
			return i-1;
		}
	}
}

function popSelectMenus(dt, mn, yr){
	var st_yr = 1990;
	var en_yr = 2010;

	var sel = document.getElementById('year');
	sel.innerHTML = "";

	sel.onchange = function(){updateDates(document.getElementById('date').value);};

	var opt = document.createElement('option');
	opt.innerHTML = "Year";
	sel.appendChild(opt);


	for(i=st_yr; i<=en_yr; i++){
		opt = document.createElement("option");
		opt.value = i;
		opt.innerHTML = i;
		if (i == yr) opt.selected = "selected";
		sel.appendChild(opt);
	}

	sel = document.getElementById('month');
	sel.innerHTML = "";

	sel.onchange = function(){updateDates(document.getElementById('date').value);};

	opt = document.createElement('option');
	opt.innerHTML = "Month";
	sel.appendChild(opt);

	for(i=1; i<=12; i++){
		opt = document.createElement("option");
		opt.value = i;
		opt.innerHTML = i;
		if (i == mn) opt.selected = "selected";
		sel.appendChild(opt);
	}

	updateDates(dt);
}

function updateDates(dt){
	var mn = document.getElementById('month').value;
	var yr = document.getElementById('year').value;
	if (!dt) var dt = document.getElementById('date').value;

	if (mn == "") days = 31;
	else if(yr == "") days = daysInMonth(mn, new Date().getFullYear());
	else days = daysInMonth(mn, yr);

	var sel = document.getElementById('date');
	sel.innerHTML = "";

	var opt = document.createElement('option');
	opt.innerHTML = "Date";
	sel.appendChild(opt);

	for(i=1; i<=days; i++){
		opt = document.createElement("option");
		opt.value = i;
		opt.innerHTML = i;
		if (i == dt) opt.selected="selected";
		sel.appendChild(opt);
	}
}
</script>
</head>

<body onload="popSelectMenus(5, 8, 2002);">
<select name="date" id="date"></select>
<select name="month" id="month"></select>
<select name="year" id="year"></select>
</body>
</html>

phpQuestioner · February 7, 2008

You better use some math and loops for making the options. Writing a gaint select menu with innerHTML is impractical.

Actually the original script I wrote was just fine for basic needs; but there are several ways in which one can go about creating a chained select menu.

Sign In

this code cant work in firefox.. and my day auto reset... HELP !

Recommended Posts

alvinchua

Link to comment

Share on other sites

phpQuestioner

Link to comment

Share on other sites

nogray

Link to comment

Share on other sites

phpQuestioner

Link to comment

Share on other sites

Join the conversation

Browse

Activity

Important Information