CIO Tech Eksperten IT-JOB IT-Kurser Events Podcast Søg

Log ind eller opret profil

Du kan også logge ind via nedenstående tjenester

mr-buchwald Nybegynder

27. juli 2009 - 11:13 Der er 10 kommentarer og
1 løsning

1, 2, 3... men 4 afhængige selects?!

Halløjsa!

Jeg har siddet og grublet længe over, hvordan jeg kunne lave 4 selects der er afhængige af hinanden. Jeg har nemt kunne få op til 3 afhængige selects, da de fleste eksempler på nettet er til 3 eller mindre.
Men nu er det altså sådan, at jeg skal have lavet en på 4. Jeg har, efter lang tids søgning, fundet dette eksempel, som skulle kunne lave et utælleligt antal afhængige selects:
http://www.javascripttoolbox.com/lib/dynamicoptionlist/documentation.php

Men når jeg selv prøver, vil dette script også kun virke op til 3 selects. Her er min kode:

<script type="text/javascript" src="scripts/selects/dynamicoptionlist.js"></script>

<script type="text/javascript">

var dol = new DynamicOptionList("land","amt","herred","sogn");

dol.forText("L1").addOptions("L1A1","L1A2","L1A3");
dol.forText("L2").addOptions("L2A1","L2A2","L2A3");

dol.forText("L1").forText("L1A1").addOptions("L1A1H1","L1A1H2","L1A1H3");

dol.forText("L1").forText("L1A1").forText("L1A1H1").addOptions("L1A1H1S1","L1A1H1S2","L1A1H1S3");

</script>

.. som sidder i <head> og længere nede sidder selve drop-down-listerne:

<select name="land">
<option>L1</option>
<option>L2</option>
</select>

<select name="amt">
<script type="text/javascript">do.printOptions("amt")</script>
</select>

<select name="herred">
<script type="text/javascript">do.printOptions("herred")</script>
</select>

<select name="sogn">
<script type="text/javascript">do.printOptions("sogn")</script>
</select>

Nu er spørgsmålet så, hvad der er gjort forkert?

Det næste jeg så skal gruble over, er hvordan jeg på en god måde, får den til at hente alle data til de 4 selects ned fra en MySQL-database...!?

Synes godt om

olebole Juniormester

27. juli 2009 - 13:22 #1

<ole>

Da du ikke har lagt det ind i en funktion, afvikles JavaScriptet formodentlig længe inden, din browser er kommet ned til koden, som implementerer dine selects. Den har derfor ingen anelse om, hvilke elementer siden består af, når scriptet kører.

Du kan f.eks. lægge scriptet ned i bunden af dokumentet - lige før </body>. Så virker det formodentlig

/mvh
</bole>

Synes godt om

olebole Juniormester

27. juli 2009 - 13:23 #2

PS: Husk altid at have fejlmeddelelser slået til i browsere, så du kan se, hvad du laver af fejl. Det er et must, når man udvikler til WWW ;o)

Synes godt om

mr-buchwald Nybegynder

27. juli 2009 - 15:00 #3

Nu har jeg prøvet at sætte scriptet ned under de 4 selects, men uden den mindste bedring.

Jeg har nu hentet fejlmeddelserne, som Opera har vist.

JavaScript
User Javascript thread
Error:
name: TypeError
message: Statement on line 2097: Type mismatch (usually non-object value supplied where object required)
stacktrace: n/a; see opera:config#UserPrefs|Exceptions Have Stacktrace

JavaScript
Inline script compilation
Syntax error while loading: line 1 of inline script at http://127.0.0.1/***.php :
Expected statement
do.printOptions("amt")
---^

JavaScript
Inline script compilation
Syntax error while loading: line 1 of inline script at http://127.0.0.1/***.php :
Expected statement
do.printOptions("herred")
---^

JavaScript
Inline script compilation
Syntax error while loading: line 1 of inline script at http://127.0.0.1/***.php :
Expected statement
do.printOptions("sogn")
---^

JavaScript
Event thread: load
Error:
name: TypeError
message: Statement on line 276: Cannot convert undefined or null to Object
stacktrace: n/a; see opera:config#UserPrefs|Exceptions Have Stacktrace

Synes godt om

olebole Juniormester

27. juli 2009 - 15:27 #4

Jeg kan ikke se, du har nogen objekter ved navn do. Derimod har du et, som hedder dol, så mon ikke, der skal stå:
<script type="text/javascript">dol.printOptions("amt")</script>

- og så fremdeles?

Synes godt om

mr-buchwald Nybegynder

27. juli 2009 - 16:37 #5

Nu får jeg disse fejlmeddelser i stedet - Ingen forbedringer hvad ang. den 4. select.

JavaScript
User Javascript thread
Error:
name: TypeError
message: Statement on line 2097: Type mismatch (usually non-object value supplied where object required)
stacktrace: n/a; see opera:config#UserPrefs|Exceptions Have Stacktrace

JavaScript
Inline script thread
Error:
name: ReferenceError
message: Statement on line 1: Undefined variable: dol
stacktrace: n/a; see opera:config#UserPrefs|Exceptions Have Stacktrace

JavaScript
Inline script thread
Error:
name: ReferenceError
message: Statement on line 1: Undefined variable: dol
stacktrace: n/a; see opera:config#UserPrefs|Exceptions Have Stacktrace

JavaScript
Inline script thread
Error:
name: ReferenceError
message: Statement on line 1: Undefined variable: dol
stacktrace: n/a; see opera:config#UserPrefs|Exceptions Have Stacktrace

JavaScript
Event thread: load
Error:
name: TypeError
message: Statement on line 276: Cannot convert undefined or null to Object
stacktrace: n/a; see opera:config#UserPrefs|Exceptions Have Stacktrace

Synes godt om

roenving Novice

27. juli 2009 - 18:45 #6

Måske mit oldgamle og svært håndtérlige script: http://roenving.users.whitehat.dk/WD4Selects-beta.html

Synes godt om

mr-buchwald Nybegynder

27. juli 2009 - 20:29 #7

Det skam ikke så ringe endda. Det er faktisk det script, jeg har brugt ind til nu, da jeg fik behov for 4 afhængige selects.

Jeg har også forsøgt med dit script, men uden held.

Hvis du kan omskrive det til 4 afhængige selects ville det også bare være super! :D

Synes godt om

roenving Novice

28. juli 2009 - 13:05 #8

Største problem er helt klart at have styr på databasen, arrayet som indeholder data ...

-- vil lave et eksempel hvor der er fire niveauer !-)

Synes godt om

roenving Novice

28. juli 2009 - 15:26 #9

Sådan, som sagt pas på databasen !-)

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Smart selects</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<LINK HREF="style/style.css" REL="stylesheet" TYPE="text/css">
<style type="text/css">
body{padding:10px;font-family:Tahoma,Verdana,Arial,sans-serif;text-align:center;background:#EBD3E2;line-height:1.5;overflow:hidden;}
</style>

<script type="text/javascript">
var arr = [
["Valg 1",[
["2. valg 1 (1)",[
["3. valg 1 (1-1)",
["4. valg 1 (1-1-1)","4. valg 2 (1-1-1)","4. valg 3 (1-1-1)"]],
["3. valg 2 (1-1)",
["4. valg 1 (1-1-2)","4. valg 2 (1-1-2)","4. valg 3 (1-1-2)"]],
["3. valg 3 (1-1)",
["4. valg 1 (1-1-3)","4. valg 2 (1-1-3)","4. valg 3 (1-1-3)"]],
["3. valg 4 (1-1)",
["4. valg 1 (1-1-4)","4. valg 2 (1-1-4)","4. valg 3 (1-1-4)"]]]],
["2. valg 2 (1)",[
["3. valg 1 (1-2)",
["4. valg 1 (1-2-1)","4. valg 2 (1-2-1)","4. valg 3 (1-2-1)"]],
["3. valg 2 (1-2)",
["4. valg 1 (1-2-2)","4. valg 2 (1-2-2)","4. valg 3 (1-2-2)"]],
["3. valg 3 (1-2)",
["4. valg 1 (1-2-3)","4. valg 2 (1-2-3)","4. valg 3 (1-2-3)"]]]],
["2. valg 3 (1)",[
["3. valg 1 (1-2)",
["4. valg 1 (1-2-1)","4. valg 2 (1-2-1)","4. valg 3 (1-2-1)"]],
["3. valg 2 (1-2)",
["4. valg 1 (1-2-2)","4. valg 2 (1-2-2)","4. valg 3 (1-2-2)"]],
["3. valg 3 (1-2)",
["4. valg 1 (1-2-3)","4. valg 2 (1-2-3)","4. valg 3 (1-2-3)"]]]]]],
["Valg 2",[
["2. valg 1 (2)",[
["3. valg 1 (2-1)",
["4. valg 1 (2-1-1)","4. valg 2 (2-1-1)","4. valg 3 (2-1-1)"]],
["3. valg 2 (2-1)",
["4. valg 1 (2-1-2)","4. valg 2 (2-1-2)","4. valg 3 (2-1-2)"]],
["3. valg 3 (2-1)",
["4. valg 1 (2-1-3)","4. valg 2 (2-1-3)","4. valg 3 (2-1-3)"]],
["3. valg 4 (2-1)",
["4. valg 1 (2-1-4)","4. valg 2 (2-1-4)","4. valg 3 (2-1-4)"]]]],
["2. valg 2 (2)",[
["3. valg 1 (2-2)",
["4. valg 1 (2-2-1)","4. valg 2 (2-2-1)","4. valg 3 (2-2-1)"]],
["3. valg 2 (2-2)",
["4. valg 1 (2-2-2)","4. valg 2 (2-2-2)","4. valg 3 (2-2-2)"]],
["3. valg 3 (2-2)",
["4. valg 1 (2-2-3)","4. valg 2 (2-2-3)","4. valg 3 (2-2-3)"]]]],
["2. valg 3 (2)",[
["3. valg 1 (2-2)",
["4. valg 1 (2-2-1)","4. valg 2 (2-2-1)","4. valg 3 (2-2-1)"]],
["3. valg 2 (2-2)",
["4. valg 1 (2-2-2)","4. valg 2 (2-2-2)","4. valg 3 (2-2-2)"]],
["3. valg 3 (2-2)",
["4. valg 1 (2-2-3)","4. valg 2 (2-2-3)","4. valg 3 (2-2-3)"]]]]]],
["Valg 3",[
["2. valg 1 (3)",[
["3. valg 1 (3-1)",
["4. valg 1 (3-1-1)","4. valg 2 (3-1-1)","4. valg 3 (3-1-1)"]],
["3. valg 2 (3-1)",
["4. valg 1 (3-1-2)","4. valg 2 (3-1-2)","4. valg 3 (3-1-2)"]],
["3. valg 3 (3-1)",
["4. valg 1 (3-1-3)","4. valg 2 (3-1-3)","4. valg 3 (3-1-3)"]],
["3. valg 4 (3-1)",
["4. valg 1 (3-1-4)","4. valg 2 (3-1-4)","4. valg 3 (3-1-4)"]]]],
["2. valg 2 (3)",[
["3. valg 1 (3-2)",
["4. valg 1 (3-2-1)","4. valg 2 (3-2-1)","4. valg 3 (3-2-1)"]],
["3. valg 2 (3-2)",
["4. valg 1 (3-2-2)","4. valg 2 (3-2-2)","4. valg 3 (3-2-2)"]],
["3. valg 3 (3-2)",
["4. valg 1 (3-2-3)","4. valg 2 (3-2-3)","4. valg 3 (3-2-3)"]]]],
["2. valg 3 (3)",[
["3. valg 1 (3-2)",
["4. valg 1 (3-2-1)","4. valg 2 (3-2-1)","4. valg 3 (3-2-1)"]],
["3. valg 2 (3-2)",
["4. valg 1 (3-2-2)","4. valg 2 (3-2-2)","4. valg 3 (3-2-2)"]],
["3. valg 3 (3-2)",
["4. valg 1 (3-2-3)","4. valg 2 (3-2-3)","4. valg 3 (3-2-3)"]]]]]]
];
//alert(arr1[1][1])
function initSels(){
createOpts(document.getElementById('sel1'));
}

function createOpts(sel){
var s = new Array();
var num = 0, txt = "arr";
var ar = opt = null;
var n = sel.selectedIndex;
var args = createOpts.arguments.length;
for(var i=1;args>i;i++){
s[i-1] = document.getElementById(createOpts.arguments[i]);
if(s[i-1]==sel)num=i;
}
if(args>1){
if(s[num])sel = s[num];
else return;
}
if(n==0&&args>1){
for(i=num;args>i+1;i++){
s[i].length = 0;
opt = document.createElement('OPTION');
s[i].appendChild(opt);
opt.value = "";
opt.text = "\74-- Vælg --";
}
return true
};
for(i=0;num>i;i++){
txt+="["+(s[i].selectedIndex-1)+"][1]";
}
ar = eval(txt);
sel.length = 0;
opt = document.createElement('OPTION');
sel.appendChild(opt);
opt.value = "";
opt.text = "-- Vælg --";
for(i=0;ar.length>i;i++){
opt = document.createElement('OPTION');
sel.appendChild(opt);
if(typeof ar[i] == 'object'){
opt.value = ar[i][0];
opt.text = ar[i][0];
}else{
opt.value = ar[i];
opt.text = ar[i];
}
}
if(args>num+2){
for(i=num+1;args-1>i;i++){
s[i].length = 0;
opt = document.createElement('OPTION');
s[i].appendChild(opt);
opt.value = "";
opt.text = "\74-- Vælg --";
}
}
}
window.onload = function(){
initSels();
}
</script>
</head>

<body>
<h1 style=>Working demo #4 beta2 - 4 afhængige</h1>
Afhængige selects<br><br>

Fire afhængige selects:   
<select name="sel1" id="sel1" onchange="createOpts(this,'sel1','sel2','sel3','sel4');">
<option value="" selected>Vis alle</option>
</select>      
<select name="sel2" id="sel2" onchange="createOpts(this,'sel1','sel2','sel3','sel4');">
<option value="" selected><-- Vælg --</option>
</select>      
<select name="sel3" id="sel3" onchange="createOpts(this,'sel1','sel2','sel3','sel4');">
<option value="" selected><-- Vælg --</option>
</select>      
<select name="sel4" id="sel4">
<option value="" selected><-- Vælg --</option>
</select>      
<br><br>

</body>
</html>

Synes godt om

mr-buchwald Nybegynder

23. august 2009 - 14:19 #10

Genialt! - Det virker bare!

Jeg kan se, at jeg modificerede den forkert i sin tid :D

TUSIND tak for hjælpen! :P
Læg et svar, så du kan få dine VELFORTJENTE points!

Synes godt om

roenving Novice

23. august 2009 - 14:46 #11

Velbekomme '-)

Synes godt om

Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Følg dette spørgsmål

Opret Preview

Webudvikling kurser

Vi tilbyder markedets bedste kurser inden for webudvikling

Se alle Webudvikling kurser

Flere spørgsmål fra JavaScript kategorien

Titel	Indlæg	Oprettet	Seneste aktivitet
Sæt vindue størrelse Af poulmadsen i JavaScript	1	08/10/202417:18	13/10/202412:33
Opgavestyring Af ingeman i JavaScript	1	15/09/202416:06	15/09/202420:40
Returner ikke alt Af ingeman i JavaScript	13	26/06/202414:40	01/07/202417:00
Vis og skjul sektioner - virker kun på den første sektion Af nemlig i JavaScript	4	24/06/202422:50	26/06/202420:33
Hente og gemme Cookies like this. Af DanishBear i JavaScript	6	04/06/202416:23	05/06/202414:23

Se alle spørgsmål i kategorien Opret spørgsmål

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester

Alle kategorier på Eksperten

Seneste artiklerRSS

20/12

Netværkstest: Første mesh-sæt med komplette WiFi 7-features sætter nye rekorder for dækning og hastighed

20/12

Omsætning er steget med 100 millioner kroner på to år: Microsoft danske udviklingscenter har udbetalt milliarder i udbytte

20/12

Nørgaard: Copilot scorer pænt højt i min kendte 3D-test (Dyrt, Dumt, Dårligt)

20/12

Amazon ramt af største strejke nogensinde: Ansatte gået hjem

20/12

CISO Sarah Aalborg forlader Tivoli: Her er hendes planer for fremtiden

20/12

Sådan vil Domstolsstyrelsen nedbringe legacy og teknisk gæld: Her er den nye plan

20/12

Temu åbner stort varehus i Sverige og kan nu sende varer til danskerne endnu hurtigere: "Hvad vi frygtede, er sket"

20/12

Amerikansk spil-firma skal levere eSim-program til Forsvaret: Soldater skal lære at håndtere kampvogne på computer

20/12

Danmark har det hurtigste internet i Norden

20/12

Behov for mere vidensdeling om AI: Sådan bliver du bedre rustet

20/12

Julepynt, papkasser og drikkevarer flyder på politiets datacenter - og uautoriserede personer kan have haft adgang til serverrum

Vis flere artikler

IT-JOB

BEC

Data Analyst

Region Sjælland

Udvikler til Identity Management teamet i Koncern Digitalisering

Metroselskabet og Hovedstadens Letbane

BIM Coordinator

Scan Global Logistics

IT-Supporter til globalt og dynamisk miljø

Danoffice IT

Senior AI Specialist

Vis flere jobs

Seneste spørgsmål Seneste aktivitet

I går 22:16	Er "OneDrive" et "Must" ? Koster det penge ? Af Ikke-ekspert i Windows
I går 16:42	Windows Media Player - Hvilken version (Versioner) er gode til at afspille og kopiere ? Af Ikke-ekspert i Musik & videoafspillere
I går 12:54	Fejlfinding: Årsag til blank skærm og ingen BIOS fra Lenovo 90BH Af Mads i PC
I går 09:42	Outlook - kan ikke kopiere opgaver Af barth i Office & Kontorpakker
I går 00:26	Genhøre telefonsamtale Af anonym24 i Chat & Messaging