Solved

populate year drop down list

Posted on 2010-11-20
9
446 Views
Last Modified: 2013-11-05
i need to populate a year drop down list with a blank option but cant quite get it.
function populateYearSelect()

{

	d = new Date();

	curr_year = d.getFullYear();



	//document.getElementById('ddlexpyear').options = new Option("x");



	for(i = 0; i < 9; i++)

	{

		document.getElementById('ddlexpyear').options[i] = new Option(curr_year+i,curr_year+i);

	}

}

Open in new window

0
Comment
Question by:vicomin
  • 5
  • 3
9 Comments
 
LVL 82

Expert Comment

by:leakim971
ID: 34179722
check this page : http://www.w3schools.com/jsref/met_select_add.asp

var y = document.createElement('option');
y.text='';
var x=document.getElementById("ddlexpyear");
try { x.add(y,null); } catch(ex) { x.add(y); }
0
 
LVL 28

Expert Comment

by:sammySeltzer
ID: 34179734
Handle this on the form side of things like:

<select name="year" onChange="populateYearSelect(this.form)">
<form name="">Select Year</form>

then the rest

</select>
0
 
LVL 82

Expert Comment

by:leakim971
ID: 34179736
So :

	function populateYearSelect()
	{
		d = new Date();
		curr_year = d.getFullYear();

		addOption('', "ddlexpyear");

		for(i = 0; i < 9; i++)
		{
			addOption(curr_year+i, "ddlexpyear");;
		}
	}

	function addOption(text, dropdownId) {
		var y = document.createElement('option');
		y.text = text;
		var x = document.getElementById(dropdownId);
		try { x.add(y,null); } catch(ex) { x.add(y); }
	}

Open in new window


Test page :


<!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 populateYearSelect()
	{
		d = new Date();
		curr_year = d.getFullYear();

		addOption('', "ddlexpyear");

		for(i = 0; i < 9; i++)
		{
			addOption(curr_year+i, "ddlexpyear");;
		}
	}

	function addOption(text, dropdownId) {
		var y = document.createElement('option');
		y.text = text;
		var x = document.getElementById(dropdownId);
		try { x.add(y,null); } catch(ex) { x.add(y); }
	}

</script>
</head>
<body onload="populateYearSelect();">
<select id="ddlexpyear"></select>
</body>
</html>

Open in new window

0
 

Author Comment

by:vicomin
ID: 34179866
leakim971 - that creates a blank entry in the ddl but when i run my validation it fails and when i submit to the 2nd page it shows the value as empty. if i view the page source it shows:




validation that the 1st option is not selected.



		if(document.orderform.ddlexpyear.value == "")

   		{

					alert('You must select another year.')

					document.orderform.ddlexpyear.focus();

					return false;

		}





page source in browser

<select name="ddlexpyear" id="ddlexpyear" class="ddl-exp" tabindex="15">

 

</select>

Open in new window

0
IT, Stop Being Called Into Every Meeting

Highfive is so simple that setting up every meeting room takes just minutes and every employee will be able to start or join a call from any room with ease. Never be called into a meeting just to get it started again. This is how video conferencing should work!

 
LVL 82

Expert Comment

by:leakim971
ID: 34179872
So use :

addOption(' ', "ddlexpyear"); // there's a space inside

instead : addOption('', "ddlexpyear");
0
 

Author Comment

by:vicomin
ID: 34179893
no luck - the validation prompts even if a year is selected.
0
 
LVL 82

Accepted Solution

by:
leakim971 earned 500 total points
ID: 34179904
ok, add : y.value = text;

and remove the space : addOption('', "ddlexpyear");
function addOption(text, dropdownId) {
		var y = document.createElement('option');
		y.text = text;
		y.value = text;
		var x = document.getElementById(dropdownId);
		try { x.add(y,null); } catch(ex) { x.add(y); }
	}

Open in new window

0
 

Author Comment

by:vicomin
ID: 34179953
got it with the validation
if(document.orderform.ddlexpyear.selectedIndex==0)

not sure why i forgot about the index - duh
0
 
LVL 82

Expert Comment

by:leakim971
ID: 34179974
>not sure why i forgot about the index - duh

You may be able to sue the value instead the selectedIndex
But you right use the selectedIndex is a good choice I think

Thanks for the points!
0

Featured Post

How your wiki can always stay up-to-date

Quip doubles as a “living” wiki and a project management tool that evolves with your organization. As you finish projects in Quip, the work remains, easily accessible to all team members, new and old.
- Increase transparency
- Onboard new hires faster
- Access from mobile/offline

Join & Write a Comment

In my daily work (mainly using ASP.net), I need to write a lot of JavaScript code. One of the most repetitive tasks I do are the jQuery Ajax calls. You know: (CODE) I don't know if for you it's the same, but for me is soooo tedious to write the …
International Data Corporation (IDC) prognosticates that before the current the year gets over disbursing on IT framework products to be sent in cloud environs will be $37.1B.
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

744 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

9 Experts available now in Live!

Get 1:1 Help Now