Welcome to WebmasterWorld Guest from

Forum Moderators: open

Message Too Old, No Replies

Hiding / Displaying ComboBoxes

2:10 am on Jan 8, 2005 (gmt 0)

Full Member

10+ Year Member

joined:Mar 21, 2003
votes: 0

Hi guys, long time no post. I'm a little new to javascript and have created a nice form using javascript (so i can show the calculation from the form on-the-fly) now i need to add an if statement or command to show or hide a number of options depending on the option specified in the first field, best way to simplify and describe it is thus;

lets say the first combobox consists of the following values;


if 1 was selected i would like 1 extra combo box to appear or become available with the second list of variables in, lets say that was;


I will say that the content of each of the second value boxes is the same list of values, but each needs to be unique as i have used it in a calculation.

So for example if i selected 1 in the first combo box, one more popup box would appear, if i select 2 then two would appear etc...

Thanks in advance

4:58 am on Jan 9, 2005 (gmt 0)

Junior Member

10+ Year Member

joined:July 20, 2001
votes: 0

This little demo might be helpful.

<script type='text/javascript'>
window.onload = function()
var sel = document.forms['form1'].sel;
if (sel && sel[0].style) {
sel[0].onchange = selOnChange;
for (var i = 1; i < sel.length; ++i) {
sel[i].style.display = 'none';
function selOnChange()
var sel = this.form.sel;
var max = parseInt(this.options[this.selectedIndex].text);
for (var i = 1; i < sel.length; ++i) {
sel[i].style.display = (i <= max)? 'inline' : 'none';

<form id='form1'>
<select name='sel'>
<select name='sel'>
<select name='sel'>
<select name='sel'>