Har ett litet problem och tänkte höra om det finns någon snäll människa som skulle kunna hjälpa mig.
Det är en droplist som styr värdet i en annan droplist. (Ex. Väljer jag ett värde i droplisten "brand" så dyker det upp nya värden i droplisten "model")
Mitt problem: Jag vill att det alltid ska stå "- Välj modell -" överst i "model"-droplisten.
Nån som vet?
Se koden nedan.
<script LANGUAGE="JavaScript" TYPE="text/javascript">
KAT = new Array();
KAT[0] = new Array ('modell1','modell2','modell3');
KAT[1] = new Array ('modell4','modell5','modell6');
KAT[2] = new Array ('modell7','modell8','modell9');
function populate2(nr, theForm) {
if(nr==0)
return;
nr--;
theForm.car_model.options.length = KAT[nr].length;
for(i=0; i<KAT[nr].length; i++){
theForm.car_model.options[i].text = KAT[nr][i];
theForm.car_model.options[i].value = KAT[nr][i];
}
}
</script>
<form method="post" name="form" action="index.asp?s=next">
<select name="brand" onchange="populate2(this.selectedIndex, this.form)" style="width:100px;">
<option value="">- Alla märken -</option>
<option value="Nokia">Nokia</option>
<option value="Sony ericsson">Sony ericsson</option>
<option value="Motorola">Motorola</option>
</select>
<br><br>
<select name="model" style="width:100px">
<option value=''>- Välj modell -</option>
</select>
</form>
Du får ett javascriptfel som säger att i inte är definierad, vilket beror på att jag inte ersatte räknaren med 0. Du har ju ingen räknare där, och texten ska ju alltid ligga överst.
<R>
Tur man testade vad man föreslog, det visade sig att den försvinner meddetsamma, eftersom loopen lägger in värdet på plats 0 i arrayen där den ska ligga, på första plats.
Efter lite justering av räknare och loopar blir det såhär.
Då får väl jag komma med en klockren lösning som vanligt!
Observera!! Du måste skilja på stora och små bokstäver i märkesnamnet med detta skript. Står det Sony Ericsson högst upp så blir det fel om det står value="Sony ericsson" i option-taggen.
<script LANGUAGE="JavaScript" TYPE="text/javascript">
KAT = {
'Nokia': ['Nmodell1','Nmodell2','Nmodell3'],
'Sony Ericsson': ['Smodell4','Smodell5','Smodell6'],
'Motorola': ['Mmodell7','Mmodell8','Mmodell9']
}
function ZOption(caption){
var tempel = document.createElement("OPTION");
tempel.value = caption;
tempel.appendChild(document.createTextNode(caption));
return tempel;
}
function populate3(thisone, theotherone, cats) {
// Depopulate model list (But leave topmost option)
while (theotherone.options[1])
theotherone.removeChild(theotherone.options[1]);
// If no brand is selected, leave!
if (!thisone.options[thisone.selectedIndex].value)
return;
// Get the correct array
var tname = thisone.options[thisone.selectedIndex].value,
tra = cats[tname];
for (var i=0; i<tra.length; i++)
theotherone.appendChild(new ZOption(tra[i]));
}
</script>
<form method="post" name="form" action="index.asp?s=next">
<select name="brand" onchange="populate3(this, this.form.model, KAT)" style="width:100px;">
<option value="">- Välj märke -</option>
<option value="Nokia">Nokia</option>
<option value="Sony Ericsson">Sony ericsson</option>
<option value="Motorola">Motorola</option>
</select>
<br><br>
<select name="model" style="width:100px">
<option value=''>- Välj modell -</option>
</select>
</form>