View Full Version : How click on combo data to show into another

04-02-2013, 12:08 PM

I have created few combo box with few data in those. Please check my site raihans.co.uk. and log in as: dbuser, pass: passwd. Then hover on User Log In/Out, click DB Test.

What I am looking is: say,
if I click on 'one' in Combo1, in 2nd Combo it will show like: 11, 12, 13, 14, 15;
or if I click on 'two' in Combo1, in 2nd Combo it will show like: 21, 22, 23, 24, 25;

again if I click on say, '12' in 2nd Combo, in 3rd Combo, it will show like: 111, 112, 113, 114 and so on.
I have tried in some way, but can't sort it out.

Pls, help me, how I can do this?

Thanking you in advance.


04-02-2013, 04:05 PM
Have a look at


<script type="text/javascript">

var categories = [];
categories["startList"] = ["Spain","France","Turkey","Greece"]
categories["Spain"] = ["Alicante","Barcelona","Malaga"];
categories["France"] = ["Paris","Nice","Lyon"];
categories["Turkey"] = ["Dalaman","Antalya","Bodrum"];
categories["Greece"] = ["Athens","Rhodes","Zante"];
categories["Alicante"] = ["Benidorm","El Abir","Finestra"];
categories["Barcelona"] = ["Lloret","Santa Suzanna","La Pineda"];
categories["Malaga"] = ["Puerto Banus","Fuengirola","Benalmadena"];
categories["Paris"] = ["Paris","Disneyland","Orly"];
categories["Nice"] = ["Nice","Monaco","Cannes"];
categories["Lyon"] = ["A","B","C"];
categories["Dalaman"] = ["A","B","C"];
categories["Antalya"] = ["d","e","f"];
categories["Bodrum"] = ["g","h","i"];
categories["Athens"] = ["1","2","3"];
categories["Rhodes"] = ["1a","2b","3c"];
categories["Zante"] = ["V","Y","A"];

var myarray = [];
myarray["startList2"] = ["Spain2","France2","Turkey2","Greece2"]
myarray["Spain2"] = ["Alicante2","Barcelona2","Malaga2"];
myarray["France2"] = ["Paris2","Nice2","Lyon2"];
myarray["Turkey2"] = ["Dalaman2","Antalya2","Bodrum2"];
myarray["Greece2"] = ["Athens2","Rhodes2","Zante2"];
myarray["Alicante2"] = ["Benidorm2","El Abir2","Finestra2"];
myarray["Barcelona2"] = ["Lloret2","Santa Suzanna2","La Pineda2"];
myarray["Malaga2"] = ["Puerto Banus2","Fuengirola2","Benalmadena2"];
myarray["Paris2"] = ["Paris2","Disneyland2","Orly2"];
myarray["Nice2"] = ["Nice2","Monaco2","Cannes2"];
myarray["Lyon2"] = ["A2","B2","C2"];
myarray["Dalaman2"] = ["A2","B2","C2"];
myarray["Antalya2"] = ["d2","e2","f2"];
myarray["Bodrum2"] = ["g2","h2","i2"];
myarray["Athens2"] = ["12","22","32"];
myarray["Rhodes2"] = ["1a2","2b2","3c2"];
myarray["Zante2"] = ["V2","Y2","A2"];

function fillSelect(sel,ary,nxt){
if (ary&&sel.form){
var frm=sel.form,nme=sel.name.replace(/\d/g,""),i=Number(sel.name.replace(/\D/g,""))+1,nxt=frm[nxt],opts=sel.options,oary=[],z0=nxt==sel?0:1,z1=0,z1a;
while (frm[nme+i]){
for (;z0<opts.length;z0++){
if (opts[z0].selected&&ary[opts[z0].value]){
if (nxt){
for (;z1<oary.length;z1++){
nxt.options[z1+1]=new Option(oary[z1],oary[z1]);

function getValue(isValue) {

function init() {
// fillSelect(document.forms[0]['sel1'],myarray,'sel1')

navigator.appName == "Microsoft Internet Explorer" ? attachEvent('onload', init, false) : addEventListener('load', init, false);


<form action="">

<select name='List1' multiple="multiple" style="height:90px;" >
<option value="startList" selected>Select Country</option>
<input type="button" name="" value="Go" onmouseup="fillSelect(this.form['List1'],categories,'List2')"/>

<select name='List2' onchange="fillSelect(this,categories,'List3')">
<option selected>Select Airport</option>
<select name='List3' onchange="getValue(this.value)">
<option selected >Select Resort</option>
<br />
<br />

<select name='sel1' onchange="fillSelect(this,myarray,'sel2')">
<option value="startList2" selected>Select Country</option>
<select name='sel2' onchange="fillSelect(this,myarray,'sel3')">
<option selected>Select Airport</option>
<select name='sel3' onchange="getValue(this.value)">
<option selected >Select Resort</option>

<script> vic=0; </script>
<form name=Show id=Show style="position:absolute;visibility:visible;top:700px;left:0px;" >
<input size=100 name=Show0 >
<input size=10 name=Show1 >
<input size=10 name=Show2 >
<input size=10 name=Show3 >
<input size=10 name=Show4 >
<input size=10 name=Show5 >
<input size=10 name=Show6 >
<input size=10 name=Show7 >
<input size=10 name=Show8 >
<input size=10 name=Show9 ><br>
<textarea name=TA rows=1 cols=100 ></textarea>


04-03-2013, 11:42 AM
Hi vwphillips,
Thnx a lot for your reply. It's working with a bit modification as of my requirement. Could you please also help me about DBs, I will gratefull to you.

After your reply, I will post my problem. Thanking you again.


04-03-2013, 02:41 PM
I am afraid I can not help with your data base.