472,782 Members | 1,494 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 472,782 software developers and data experts.

how to render an option value dynamic !

I have to insert in a html select the last 10 years

<select name="year" onChange="month()" size=5>
<option value="1994">1994</option>
<option value="1995">1995</option>
<option value="1996">1996</option>
<option value="1997">1997</option>
<option value="1998">1998</option>
<option value="1999">1999</option>
<option value="2000">2000</option>
<option value="2001">2001</option>
<option value="2002">2002</option>
<option value="2003">2003</option>
<option value="2004">2004</option>
</select>

I did this way. I d like to do it dynamically in javascript but I have
no idea how to insert the result of a function in an option value.
Please help
Gianni
Jul 23 '05 #1
9 2088
rf

"Gianni" <pi***********@yahoo.it> wrote in message
news:3c**************************@posting.google.c om...
I have to insert in a html select the last 10 years

<select name="year" onChange="month()" size=5>
<option value="1994">1994</option>
<option value="1995">1995</option>
<option value="1996">1996</option>
<option value="1997">1997</option>
<option value="1998">1998</option>
<option value="1999">1999</option>
<option value="2000">2000</option>
<option value="2001">2001</option>
<option value="2002">2002</option>
<option value="2003">2003</option>
<option value="2004">2004</option>
</select>

I did this way. I d like to do it dynamically in javascript but I have
no idea how to insert the result of a function in an option value.


You have already written it. Why do you want to now automate it?

--
Cheers
Richard.
Jul 23 '05 #2
"rf" <rf@.invalid> wrote in message
news:Iw*******************@news-server.bigpond.net.au...

"Gianni" <pi***********@yahoo.it> wrote in message
news:3c**************************@posting.google.c om...
I have to insert in a html select the last 10 years

<select name="year" onChange="month()" size=5>
<option value="1994">1994</option>
<option value="1995">1995</option>
<option value="1996">1996</option>
<option value="1997">1997</option>
<option value="1998">1998</option>
<option value="1999">1999</option>
<option value="2000">2000</option>
<option value="2001">2001</option>
<option value="2002">2002</option>
<option value="2003">2003</option>
<option value="2004">2004</option>
</select>

I did this way. I d like to do it dynamically in javascript but I have
no idea how to insert the result of a function in an option value.


You have already written it. Why do you want to now automate it?


Eh... 2005?
Here's one way to do it:

Put <div id='tenYearsComboLayer'></div> on the page where you want your
combo.

then execute the following code in the page's onload() event:

function drawTenYearCombo(){

var comboLayer = document.getElementById('tenYearsComboLayer');
var buffer = "<select name='year' onChange='month();' size='5'>";

var now = new Date();
var thisYear = now.getFullYear();

for( var n=10; n>0; n--)
buffer += "<option value='" + (thisYear - n) + "'>" + (thisYear - n) +
"</option>";

buffer += "</select>";
comboLayer.innerHTML = buffer;

}

--
Dag
5826'15.9" N 00846'45.5" E
Jul 23 '05 #3
"Dag Sunde" <ds@orion.no-way> wrote in message
news:Ro****************@juliett.dax.net...
"rf" <rf@.invalid> wrote in message
news:Iw*******************@news-server.bigpond.net.au...

"Gianni" <pi***********@yahoo.it> wrote in message
news:3c**************************@posting.google.c om...
I have to insert in a html select the last 10 years

<select name="year" onChange="month()" size=5>

<snipped />
Here's one way to do it:

Put <div id='tenYearsComboLayer'></div> on the page where you want your
combo.

then execute the following code in the page's onload() event:

function drawTenYearCombo(){

var comboLayer = document.getElementById('tenYearsComboLayer');
var buffer = "<select name='year' onChange='month();' size='5'>";

var now = new Date();
var thisYear = now.getFullYear();

for( var n=10; n>0; n--)
buffer += "<option value='" + (thisYear - n) + "'>" + (thisYear - n) +
"</option>";

buffer += "</select>";
comboLayer.innerHTML = buffer;


err.... that for-loop should of course read:
for( var n=10; n>=0; n--)

--
Dag
5826'15.9" N 00846'45.5" E
Jul 23 '05 #4
In article <3c**************************@posting.google.com >,
pi***********@yahoo.it enlightened us with...
I have to insert in a html select the last 10 years

<select name="year" onChange="month()" size=5>
<option value="1994">1994</option>
<option value="1995">1995</option>
<option value="1996">1996</option>
<option value="1997">1997</option>
<option value="1998">1998</option>
<option value="1999">1999</option>
<option value="2000">2000</option>
<option value="2001">2001</option>
<option value="2002">2002</option>
<option value="2003">2003</option>
<option value="2004">2004</option>
</select>

I did this way. I d like to do it dynamically in javascript but I have
no idea how to insert the result of a function in an option value.
Please help
Gianni


This sort of thing is best done with server-side scripting in case the
client doesn't have javascript enabled. I have this very thing in JSP,
though it's the last 5 years, this year, and the next 2.

As to using javascript, you wouldn't insert the result of a function.
You'd build the entire select element dynamically. Which, might I add,
would not work in old browsers like NN4, either.

Is this for an intranet application where you can know all browsers
accessing your application? If not, you'd really be better off using a
server-side script to dynamically build the html.

If you still want to use javascript and having it work only in DOM
browsers is okay by you, let me know and I'll post some code for you.

--
--
~kaeli~
Murphy's Law #2000: If enough data is collected, anything
may be proven by statistical methods.
http://www.ipwebdesign.net/wildAtHeart
http://www.ipwebdesign.net/kaelisSpace

Jul 23 '05 #5
Gianni wrote:
I have to insert in a html select the last 10 years

<select name="year" onChange="month()" size=5>
<option value="1994">1994</option> ..... <option value="2004">2004</option>
</select>

I did this way. I d like to do it dynamically in javascript but I have
no idea how to insert the result of a function in an option value.
<form>
<select name="year">
</select>
</form>

<script type="text/JavaScript">
function fillYearMenu(menu,from,to){
menu.length=0;z=to-from;
for(s=from;s<=to;s++){
menu.options[menu.options.length]=new Option(s+":
"+(z-menu.options.length)+" years ago",s);
}
}

fillYearMenu(document.forms[0].year,1994,2004)
</script>

http://www.mickweb.com/demo/years.html
Mick

</script>

The menu must exist for the function to work, and you'd need some error
checking if your parameters will be provided by user entry.

Please help
Gianni

Jul 23 '05 #6
kaeli <ti******@NOSPAM.comcast.net> wrote in message news:<MP************************@nntp.lucent.com>. ..
In article <3c**************************@posting.google.com >,
pi***********@yahoo.it enlightened us with...
I have to insert in a html select the last 10 years

<select name="year" onChange="month()" size=5>
<option value="1994">1994</option>
<option value="1995">1995</option>
<option value="1996">1996</option>
<option value="1997">1997</option>
<option value="1998">1998</option>
<option value="1999">1999</option>
<option value="2000">2000</option>
<option value="2001">2001</option>
<option value="2002">2002</option>
<option value="2003">2003</option>
<option value="2004">2004</option>
</select>

I did this way. I d like to do it dynamically in javascript but I have
no idea how to insert the result of a function in an option value.
Please help
Gianni


This sort of thing is best done with server-side scripting in case the
client doesn't have javascript enabled. I have this very thing in JSP,
though it's the last 5 years, this year, and the next 2.

As to using javascript, you wouldn't insert the result of a function.
You'd build the entire select element dynamically. Which, might I add,
would not work in old browsers like NN4, either.

Is this for an intranet application where you can know all browsers
accessing your application? If not, you'd really be better off using a
server-side script to dynamically build the html.

If you still want to use javascript and having it work only in DOM
browsers is okay by you, let me know and I'll post some code for you.

--


I d like to use javascript ... at the moment it seems easier !
what else I have to do is to show the months of the year up to the
corrent month. Can you help me in that too?
Ciao
Gianni
Jul 23 '05 #7
In article <3c**************************@posting.google.com >,
pi***********@yahoo.it enlightened us with...
I d like to use javascript ... at the moment it seems easier !


That's debatable. :)
I find it a lot easier in JSP personally.
what else I have to do is to show the months of the year up to the
corrent month. Can you help me in that too?


Tested in NN7 and IE6 only. No assumptions should be made for other
browsers - test in them if you want to check. Watch for word-wrappping.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"
"http://www.w3.org/TR/REC-html40/loose.dtd">
<html>
<head>
<title> New Document </title>
<script type="text/javascript" language="javascript">

function createYearSelect(parentElement, insertBeforeNode)
{
if (! document.getElementById || !document.createElement)
{
alert("Sorry, your browser doesn't support this operation.");
return;
}

var s = document.createElement("select");
s.id = "year";
s.name = "year";
parentElement.insertBefore(s, insertBeforeNode);

var today = new Date();
var thisYear = today.getYear();
if (thisYear < 2000) thisYear = thisYear + 1900;

for (var i=10; i>=0; i--)
{
var o = document.createElement("option");
o.name = "o"+i;
o.id = "o"+i;
o.value = (thisYear-i);
o.appendChild(document.createTextNode(thisYear-i));
s.appendChild(o);
}

// attach onchange event to select
if (s.attachEvent)
{
s.attachEvent("onchange",editMonths);
}
else if (s.addEventListener)
{
s.addEventListener("change",editMonths,false);
}
}

function editMonths()
{
var monthArray = new Array
("January","February","March","April","May","June" ,"July","August","Sept
ember","October","November","December");
// make months select depending on value of elementToCheck (year
select element)
// if it's already there, remove it and re-create

frm = document.forms["f1"];
elementToCheck = document.forms["f1"].elements["year"];

if (! document.getElementById || !document.createElement)
{
alert("Sorry, your browser doesn't support this operation.");
return;
}

if (document.getElementById("month"))
frm.removeChild(document.getElementById("month"));

// get the value of the first select
var val = elementToCheck.options[elementToCheck.selectedIndex].value;

// make month select element
var s = document.createElement("select");
s.name = "month";
s.id = "month";
frm.insertBefore(s, elementToCheck);

// fill in month select element with all months IF the selected year
is prior to this year
// OR with the months up to this month if the current year is
selected
var L;

var today = new Date();
var thisYear = today.getYear();
if (thisYear < 2000) thisYear = thisYear + 1900;
if (val == thisYear) L = today.getMonth();
else L = 11;

for (var i=0; i<=L; i++)
{
var o = document.createElement("option");
o.name = "o"+i;
o.id = "o"+i;
o.value = monthArray[i];
o.appendChild(document.createTextNode(monthArray[i]));
s.appendChild(o);
}
}

</script>
</head>

<body onLoad="createYearSelect(document.forms['f1'], document.forms
['f1'].elements['sub']);editMonths();">
<form id="f1" name="f1" action="" method="">
<br>
<input id="sub" name="sub" type="submit" value="submit">
</form>
</body>
</html>

--
--
~kaeli~
When you choke a smurf, what color does it turn?
http://www.ipwebdesign.net/wildAtHeart
http://www.ipwebdesign.net/kaelisSpace

Jul 23 '05 #8
JRS: In article <MP************************@nntp.lucent.com>, seen in
news:comp.lang.javascript, kaeli <ti******@NOSPAM.comcast.net> posted at
Wed, 14 Jul 2004 08:56:06 :

var today = new Date();
var thisYear = today.getYear();
if (thisYear < 2000) thisYear = thisYear + 1900;


I have heard that there are browsers for which that will not work
correctly, since for 1997 to 2001 their getYear() gives 97,98,99,00,01 .

For mortals,
var thisYear = 2000 + today.getYear()%100
may thus be better.
The following is expected to be safe on any browser :

function getFY(D) { var YE
YE = Math.round(D.getTime() / 31556952000) + 1970
return YE + (D.getYear()-YE)%100 }

but needs testing. Note that the constants on the middle line do not
need to be exact, if I have reasoned correctly. The code returns the
last two figures of getYear(), as part of a number which is not far from
YE, and YE is a close approximation to the correct result.

See <URL:http://www.merlyn.demon.co.uk/js-date1.htm#gY>
and <URL:http://www.merlyn.demon.co.uk/js-date1.htm#gFY>

--
John Stockton, Surrey, UK. ?@merlyn.demon.co.uk Turnpike v4.00 IE 4
<URL:http://jibbering.com/faq/> JL / RC : FAQ for news:comp.lang.javascript
<URL:http://www.merlyn.demon.co.uk/js-index.htm> jscr maths, dates, sources.
<URL:http://www.merlyn.demon.co.uk/> TP/BP/Delphi/jscr/&c, FAQ items, links.
Jul 23 '05 #9
Gianni wrote:
I d like to use javascript ... at the moment it seems easier !


You *can* use JavaScript, just do not use it client-side on a Web site.
Easier is not necessarily better, and the client-side solution is worse
here compared to the server-side one.
PointedEars
Jul 23 '05 #10

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

3
by: julian | last post by:
hi I was wondering if anyone can help me out on this.... I have dynamcally populated a drop down menu with data from an access database using ASP. The values seem fine, however when i pass...
2
by: Philip WATTS | last post by:
I have generated a dynamic option list from an array using elementCreate("OPTION") I now wish to get an event to replace this list with a new one, but of course currently, it simply adds them on...
1
by: Arjen | last post by:
IE 6 does not return the value of a dynamic option list. Mozilla performs fine. How can I get the value of a choice in IE? Simple example below. Option list is filled with first element of array...
4
by: Mark Kolber | last post by:
I did a little searching on this but couldn't find an answer... On my website, I have a section of stories (www.midlifeflight.com/stories) There are different stores on different pages that are...
4
by: Zuel | last post by:
Hi Folks. So I have a small problem. My DoPostBack function is not writen to the HTML page nor are the asp:buttons calling the DoPostBack. My Goal is to create a totaly dynamic web page where...
1
by: Kevin R | last post by:
This is one of the weirdest problems I have ever run into. I have had to trim down a bunch of code to give a sample that is more easily readable by those who will view this. Here is the problem:...
2
by: kurt sune | last post by:
How do I render the scrollbars by CSS in a listbox? I have understood that an asp listbox gets rendered as a select element. So I tried first by adding a style element: ..TA...
7
by: SteveM | last post by:
I am sure this is an easy question, but being relatively new to ASP.NET programming, I can not quite grasp what I need to accomplish what I need to do. What I have is a word document that is...
1
by: bytesFTW99 | last post by:
I have been struggling with this for some time can anyone help out? just trying to have 3 dropdown boxes that fill depending on what is selected, then in some cases click a button and have the second...
0
by: Rina0 | last post by:
Cybersecurity engineering is a specialized field that focuses on the design, development, and implementation of systems, processes, and technologies that protect against cyber threats and...
0
by: erikbower65 | last post by:
Using CodiumAI's pr-agent is simple and powerful. Follow these steps: 1. Install CodiumAI CLI: Ensure Node.js is installed, then run 'npm install -g codiumai' in the terminal. 2. Connect to...
0
linyimin
by: linyimin | last post by:
Spring Startup Analyzer generates an interactive Spring application startup report that lets you understand what contributes to the application startup time and helps to optimize it. Support for...
0
by: Taofi | last post by:
I try to insert a new record but the error message says the number of query names and destination fields are not the same This are my field names ID, Budgeted, Actual, Status and Differences ...
14
DJRhino1175
by: DJRhino1175 | last post by:
When I run this code I get an error, its Run-time error# 424 Object required...This is my first attempt at doing something like this. I test the entire code and it worked until I added this - If...
0
by: lllomh | last post by:
Define the method first this.state = { buttonBackgroundColor: 'green', isBlinking: false, // A new status is added to identify whether the button is blinking or not } autoStart=()=>{
0
by: lllomh | last post by:
How does React native implement an English player?
0
by: Mushico | last post by:
How to calculate date of retirement from date of birth
2
by: DJRhino | last post by:
Was curious if anyone else was having this same issue or not.... I was just Up/Down graded to windows 11 and now my access combo boxes are not acting right. With win 10 I could start typing...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.