Gå til innhold

"dynamiske" rulegardinliste

t542978

Av t542978
i Programmering og webutvikling

Anbefalte innlegg

t542978

t542978

Skrevet
Skrevet

La oss si vi har to rullgardinlister.

 

I den øverste (1) har du f.eks valgene Ford, Volvo, Toyota. Rullegardinisten(2) har verdier alt etter hva du velger i (1).

 

Velger du f.eks Ford i (1) -blir (2) Mondeo, Escort og Focus. Velger du Volvo i (1) blir (2) V70, S70 og S80. osv...

 

Altså når Onchange i (1) skjer, skal (2) endre verdier alt etter hva som er valgt i 1.

 

Noen som har et enkelt kode-eksempel på dette?

 

:smile:

Lenke til kommentar
  • 1 måned senere...

Videoannonse

Videoannonse
Annonse
jos

jos

Skrevet
Skrevet

Quote:


Den 2002-09-29 17:49, skrev andrees:

La oss si vi har to rullgardinlister.


I den øverste (1) har du f.eks valgene Ford, Volvo, Toyota. Rullegardinisten(2) har verdier alt etter hva du velger i (1).


Noen som har et enkelt kode-eksempel på dette?


:smile:

 

Det du trenger å gjøre er å oppdatere options arrayet til den andre rullgardin. Dette er en array av Option() objekter.

 

Det er to ting å passe på.

1) At arrayet er stort nok til å holde alle elementene.

2) Når antallet elementer skal reduseres må lengden settes "tilbake".

 

Koden under viser to select lister, hvor valg i den første får innholdet i andre til å endre seg.

 

Den setmodell() funksjonen først gjør er å hente ut listen av nye elementer. Så sørger den for at rullgardin2' options er av riktig lengde, og kopierer så inn nye verdier i den.

 

<HTML>

<HEAD>

<SCRIPT>

// Data list. Object (hash array) indexed on first select-lists values.

modeller = {"none": ["---- Velg Merke ---"],

"ford": ["--- Velg Modell ---", "Mondeo", "Focus", "Escort"],

"lotus": ["--- Velg Modell ---", "Elan", "Elise"]

};

function setmodell(form) {

var modelliste;

var selindx = form.merke.options.selectedIndex;

modelliste = modeller[form.merke.options[selindx].value];

if (modelliste != undefined) {

var i;

// Make sure there is enough Option elements

if (form.model.options.length < modelliste.length) {

// Add the missing Option elements to array.

for (i = form.model.options.length; i < modelliste.length; i++)

form.model.options = new Option();

} else if (form.model.options.length > modelliste.length) {

// Delete the extranouse elements

for (i = form.model.options.length - 1; i > modelliste.length; i++){

delete form.model.options;

}

}

// Make sure the options array length is correct.

form.model.options.length = modelliste.length;

 

// Copy the new values/selectiongs into options list.

for (i = 0; i < modelliste.length; i++) {

form.model.options.value = modelliste;

form.model.options.text = modelliste;

}

// Select first element in list.

form.model.options.selectedIndex = 0;

}

}

</SCRIPT>

</HEAD>

<BODY>

<FORM id=myform>

<SELECT name="merke" onchange="setmodell(this.form);">

<OPTION value="none">---- Velg Merke ---</OPTION>

<OPTION value="ford">Ford</OPTION>

<OPTION value="lotus">Lotus</OPTION>

</SELECT>

<SELECT name="model">

<OPTION value="-1">---- Velg Modell ----</OPTION>

</SELECT>

</BODY>

</HTML>

Lenke til kommentar
  • 6 måneder senere...
t542978

t542978

Skrevet
  • Forfatter
Skrevet

Dette fungerer bra, men har en liten bug....

 

Hvis du prøver koden og velger ford, får du opp fordmodellene. Bug'en er at skulle du så velge det første valget i boks1, -- velg merke --, rapporterer ie om feil i skriptet... har prøvd å fikse dette uten hell..

 

noen som kan tipse meg om hva som er feil?

Lenke til kommentar

Opprett en konto eller logg inn for å kommentere

Du må være et medlem for å kunne skrive en kommentar

Opprett konto

Det er enkelt å melde seg inn for å starte en ny konto!

Start en konto

Logg inn

Har du allerede en konto? Logg inn her.

Logg inn nå
Gå til emneliste
×
×
  • Opprett ny...