Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations Mike Lewis on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

populate selectbox with onchange

Status
Not open for further replies.

cyclopsvs

Programmer
Feb 21, 2007
7
0
0
NL
Hello javascript users,

I'm relativly new in using javascript and tried to populate a select box based on a value chosen in a earlier selectbox.

The code i wrote doesn't seem to work and i cant figure out what is going wrong. Can someone give me some assistance.

this is the code i wrote:

<html>
<head>
<script type='text/javascript'>
var secondOptions =
{
1 :[[Beckman Coulter Electrachrom AT,101],[BioMerieux Chromostrate ATIII,127],[BioMerieux MDA ATIII,128],[Biopep Chromopep AT,109],[Biophen Antithrombin,155],[Trinity / Biopool Spectrolyse ATIII (anti-IIa),102],[Dade Behring Antithrombin Reagent,110],[Dade Behring Berichrom Antithrombin,100],[Electrochem ATIII,113],[Helena Chromz-AT,114],[Hemolab ATIII chrome (Biomerieux),115],[Immuno ATIII chrome,125],[Nobis Nobichrom Antithrombin,126],[Pacific Hemostasis Chrom AT assay,145],[Precision Biologic Chromocheck AT,150],[Renam Reachrom ATIII,160],[Stago/Roche Antithrombin III,131],[Stago/Roche Stachrom ATIII,130],[The Binding Site AT activity,135],[Trinity / Sigma Accucolor Antithrombin,129],[Unicorn ATIII,140],[Homemade, please specify ...,190],[Other, please specify ...,199]],

2 :[[Trinity / Biopool Spectrolyse ATIII (anti-Xa),103],[Chromogenix Coamatic Antithrombin,105],[Chromogenix Coamatic AT-400,106],[Chromogenix Coamatic LR Antithrombin,108],[DG-Chromat ATIII,112],[Electrochem ATIII,113],[Hyphen-Biomed Chromopep AT,117],[I.L. HemosIL Antithrombin,120],[I.L. HemosIL liquid Antithrombin,121],[Trinity / Biopool Spectrolyse ATIII (anti-Xa),103],[Homemade, please specify ...,190],[Other, please specify ...,199]],

};

function UpdateSecondary( sel ){
var secondsel = document.getElementById('secse1');
var selvalue = sel.options[sel.selectedIndex].value;
var count = secondOptions[ selvalue ].length;

secondsel.options.length = 0;

for( i =0; i<count; i++)
secondsel.options = new Option( secondOptions[selvalue][0],secondOptions[selvalue][1] );
}

</script>

<table align='left'>
<tr valign='baseline'>
<td width='200' align='left' valign='top'>Type of Assay:</td>
<td>
<select name='assa_a' width='600' STYLE='width:150px' onChange='UpdateSecondary(this);'>

<option value=0 CLASS='text'>Select from list</option>
<option value=1 CLASS='text'>Chromogenix, anti IIa</option>
<option value=2 CLASS='text'>Chromogenix, anti Xa</option>
<option value=99 CLASS='text'>Other</option>
</select>
</td>
</tr>
<tr valign='baseline'>
<td nowrap align='left'>Specify method:</td>
<td>
<select id='secse1' name='meth_a'>
<option>Please select an Assay</option>
</select>
</td>
<td><width='200' align='left' valign='top'>if other please specify</td>
<td><width='200' align='left' valign='top'><input type='text' width=200 name='nmeth_a' size='15'></td>
<tr>

athanks in advance for your help,

r mendes
 
Code for removing from select:

Code for adding to select:

DOM select reference:
I know it might seem rude to say RTFM, lol.. But you will learn more and produce better code in the future.

The DOM site is quite good actually, as you can modify the samples there and update/test..

Ps. you will have to modify the samples there if you wish to use the functions.

1) you have to make them more dynamic (accept variables)
2) you have to make them with loops
3) bind the trigger (on select="") to the first select

Then I believe you have it!

Olav Alexander Mjelde
Admin & Webmaster
 
Thanks for your reaction,

I knew the code i wrote should have worked because i used it in another app.

Fortunatly i found the error it was only a enter in the dictionary secondOptions between the different arrays.

thanks anyway,

richard
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top