Chyba rozumiem, o co chodzi. Da sie to zrobic.
Opisze Ci, jak.
1. Dane z bazy danych trzeba przeksztalcic do tablic JS w postaci:
2. Potem to, co sie dzieje na stronie, powiazac zdarzeniami.
Czyli przy zmianie selecta pierwszego do selecta drugiego ladujesz odpowiednie wartosci.
twojSelect.options[0]=new Option("tekst", "wartosc value", czyDomyslnieZaznaczony (zwykle false), czyZaznaczony (zwykle false));
Pozdrawiam.
Zreszta sprobuje Ci cos napisac, bo pewnie nie wytlumaczylem dobrze.
<!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" xml:lang="pl" lang="pl">
<head>
<link rel="stylesheet" href="" type="text/css" />
<title>Tytu³ Strony</title>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-2" />
<meta name="language" content="pl" />
<script type="text/javascript">
/*
* Ustawiamy dane.
*
*/
//Ile selectow?
var selectCount=3;
//String <wybierz>
var chooseString="<wybierz>";
//Informacja o niemoznosci wyboru;
var emptyString="----------";
//Dane do pierwszego selecta:
var opt1=new Array();
opt1[0]={text:'damskie', value:'damskie'};
opt1[1]={text:'meskie', value:'meskie'};
//Dane do drugiego selecta:
var opt2=new Array();
opt2['damskie']=new Array();
opt2['damskie'][0]={text:'krotkie jeansy', value:'krotkie_jeansy'};
opt2['damskie'][1]={text:'dlugie jeansy', value:'dlugie_jeansy'};
opt2['damskie'][2]={text:'szerokie', value:'szerokie'};
opt2['meskie']=new Array();
opt2['meskie'][0]={text:'drechy;)', value:'drechy'};
opt2['meskie'][1]={text:'dlugie jeansy', value:'dlugie_jeansy'};
opt2['meskie'][2]={text:'szerokie', value:'szerokie'};
opt2['meskie'][3]={text:'moro', value:'moro'};
//Dane do trzeciego selecta:
var opt3=new Array();
opt3['damskie']=new Array();
opt3['damskie']['krotkie_jeansy']=new Array();
opt3['damskie']['krotkie_jeansy'][0]={text:'S', value:'S'};
opt3['damskie']['krotkie_jeansy'][1]={text:'M', value:'M'};
opt3['damskie']['dlugie_jeansy']=new Array();
opt3['damskie']['dlugie_jeansy'][0]={text:'M', value:'M'};
opt3['damskie']['szerokie']=new Array();
opt3['damskie']['szerokie'][0]={text:'L', value:'L'};
opt3['damskie']['szerokie'][1]={text:'XL', value:'XL'};
opt3['meskie']=new Array();
opt3['meskie']['drechy']=new Array();
opt3['meskie']['drechy'][0]={text:'XL', value: 'XL'};
opt3['meskie']['drechy'][1]={text:'XXL', value: 'XXL'};
opt3['meskie']['dlugie_jeansy']=new Array();
opt3['meskie']['dlugie_jeansy'][0]={text:'M', value: 'M'};
opt3['meskie']['szerokie']=new Array();
opt3['meskie']['szerokie'][0]={text:'L', value: 'L'};
opt3['meskie']['szerokie'][1]={text:'XL', value: 'XL'};
opt3['meskie']['szerokie'][2]={text:'XXL', value: 'XXL'};
opt3['meskie']['moro']=new Array();
opt3['meskie']['moro'][0]={text:'M', value: 'M'};
opt3['meskie']['moro'][1]={text:'L', value: 'L'};
opt3['meskie']['moro'][2]={text:'XL', value: 'XL'};
/*
* setSelect(select, array)
*
* @param select id elementu select ze strony
* @param array referencja do tablicy, z ktorej beda pobierane wartosci
*
* @return int -1 w przypadku bledu, 0 jesli wszystko okay
*
* Ustawia w zadanym select'cie wartosci z podanej tabeli.
*
*/
function setSelect(select, array)
{
//Czy przegladarka da rade?
if(!document.getElementById)return -1;
//Czyscimy liste opcji:
clearSelect(select, chooseString);
select=document.getElementById(select);
//Czy wybrany index poprzedniego selecta >0?
if(array==undefined)return -1;
//Wstawiamy nowe wartosci:
for(var i=0;i<array.length;i++){
select.options[i+1]=new Option(array[i].text,array[i].value,false,false);
}
}
/*
* clearSelect(select)
*
* @param select id elementu strony typu select
*
* Czysci wybrany element select.
*
*/
function clearSelect(select)
{
//Wyczysc wszystkie pola:
while(select.options.length) select.remove(0);
//Ustaw string zachecajacy do wyboru opcji:
select.options[0]=new Option(empytyString, chooseString,true,false);
}
/*
* disableSelect(select)
*
* @param select referencja do elementu strony typu select
*
* Likwiduje opcje z selecta i ustawia w nim informacje.
*
*/
function clearSelect(select, string)
{
//Czy przegladarka da rade?
if(!document.getElementById)return -1;
select=document.getElementById(select);
//Wyczysc wszystkie pola:
while(select.options.length) select.remove(0);
//Ustaw string zachecajacy do wyboru opcji:
select.options[0]=new Option(string,chooseString,true,false);
}
</script>
</head>
<body onload="setSelect('sel1',opt1);clearSelect('sel2',emptyString);clearSelect('sel3',emptyString);">
<select id="sel1" onchange="setSelect('sel2',opt2[(this.options[this.selectedIndex].value)]);clearSelect('sel3',emptyString);">
<option value=""></option>
</select>
<select id="sel2" onchange="setSelect('sel3',opt3[document.all.sel1.options[document.all.sel1.selectedIndex].value][this.options[this.selectedIndex].value])">
<option value=""></option>
</select>
<select id="sel3">
<option value=""></option>
</select>
</body>
</html>
Wszystkie moje próby nie przynosza rezultatu.