16. oktober 2002 - 16:10Der er
7 kommentarer og 1 løsning
Hjælp til DHML!
Hej med jer...
Jeg skal til at lave en bestillingsformular. På denne bestillingsformular findes der en masse "drop-down" lister, hvor man kan vælge type, farve osv.
På formularen skal der også være et "Bemærknings felt" - det vil sige, når man i en "drop-down" liste vælger en bestemt type, så kommer der til at stå "Bemærk at der bla bla..." Når man så skifter i listen så ændre bemærkningen sig også. Indtil videre er jeg selv med... (se nedenstående kode).
Ovenstående er altså når man kun vælger i en "drop-down" liste. Men i formularen er der 5 "drop-down" lister. Ligegyldigt om man vælger i "drop-down" liste nr. 1 eller nr. 5, så skal der altså komme en bemærkning frem.
Hvordan gør man det...? I nedenstående kode er der indsat en "drop-down" liste, men jeg skal ha tilføjet yderligere 4 stk. - som alle er forskellige! Men ligegyldigt hvilken man vælger i, så skal bemærkningen komme frem samme sted...
var textdisplay=new Array() textdisplay[0]="tekst1" textdisplay[1]="tekst2" textdisplay[2]="tekst3" textdisplay[3]="tekst4" textdisplay[4]="tekst5"
function displaydesc(which){ if (document.all) descriptions.innerHTML=textdisplay[which] else if (document.getElementById) document.getElementById("descriptions").innerHTML=textdisplay[which] }
Jeg var ikke helt sikker på om du ville have det, så at alle bemærkningerne blev lagt sammen og skrevet ud, eller om du kun ville have den sidste valgte.
Men jeg har lavet det så den ligger dem alle sammen. Jeg har kun testet i IE, så du må selv lige se om det virker i Netscape. Desuden står html koden temmelig rodet, men kan du selv lige ordne. ---Kode--- <form name="a294" > <table border="0" cellpadding="0" cellspacing="0" width="500"> <tr><td><table border="0" cellpadding="0" cellspacing="0" width="100%"> <tr><td>Valg 1:</td><td>Valg 2:</td><td>Valg 3:</td><td>Valg 4:</td><td>Valg 5:</td> </tr><tr><td width="100%"> <select name="a969_1" size="1" onChange="displaydesc();"> <option selected value=""></option> <option value="">Valg 1 - Tekst 1</option> <option value="">Valg 1 - Tekst 2</option> <option value="">Valg 1 - Tekst 3</option> <option value="">Valg 1 - Tekst 4</option> </select></td><td> <select name="a969_2" size="1" onChange="displaydesc();"> <option selected value=""></option> <option value="">Valg 2 - Tekst 1</option> <option value="">Valg 2 - Tekst 2</option> <option value="">Valg 2 - Tekst 3</option> <option value="">Valg 2 - Tekst 4</option> </select></td><td> <select name="a969_3" size="1" onChange="displaydesc();"> <option selected value=""></option> <option value="">Valg 3 - Tekst 1</option> <option value="">Valg 3 - Tekst 2</option> <option value="">Valg 3 - Tekst 3</option> <option value="">Valg 3 - Tekst 4</option> </select></td><td> <select name="a969_4" size="1" onChange="displaydesc();"> <option selected value=""></option> <option value="">Valg 4 - Tekst 1</option> <option value="">Valg 4 - Tekst 2</option> <option value="">Valg 4 - Tekst 3</option> <option value="">Valg 4 - Tekst 4</option> </select></td><td> <select name="a969_5" size="1" onChange="displaydesc();"> <option selected value=""></option> <option value="">Valg 5 - Tekst 1</option> <option value="">Valg 5 - Tekst 2</option> <option value="">Valg 5 - Tekst 3</option> <option value="">Valg 5 - Tekst 4</option> </select></td></tr></table></td></tr> <tr><td><br><br>Teksten:</td></tr> <tr><td><span id="descriptions" align="left"><br><br> </td></tr></table> </form> <script> //De næste linier laver 2 dimensionelt array, og det vises på 2 forskellige måder. var textdisplay=new Array(); textdisplay[0]= new Array("","Valg 1 - Tekst 1","Valg 1 - Tekst 2","Valg 1 - Tekst 3","Valg 1 - Tekst 4"); textdisplay[1]= new Array("","Valg 2 - Tekst 1","Valg 2 - Tekst 2","Valg 2 - Tekst 3","Valg 2 - Tekst 4"); textdisplay[2]= new Array("","Valg 3 - Tekst 1","Valg 3 - Tekst 2","Valg 3 - Tekst 3","Valg 3 - Tekst 4"); textdisplay[3]= new Array("","Valg 4 - Tekst 1","Valg 4 - Tekst 2","Valg 4 - Tekst 3","Valg 4 - Tekst 4"); textdisplay[4]= new Array(); textdisplay[4][0] = ""; textdisplay[4][1] = "Valg 5 - Tekst 1"; textdisplay[4][2] = "Valg 5 - Tekst 2"; textdisplay[4][3] = "Valg 5 - Tekst 3"; textdisplay[4][4] = "Valg 5 - Tekst 4";
function displaydesc(){ var Text2Show = "", data = "nej";
Text2Show += "Bemærk venligst at: <br>";
for(var i=1;i<=5;i++){ var a968 = eval("document.a294.a969_" + i); //Laver et objekt
if(a968.selectedIndex != 0){ //Hvis den øverste ikke er valgt, skal den smide text ind. if(data == "ja"){ //Hvis der står data i forvejen, skal der laves en "og:" Text2Show += "<br> og: <br>"; } Text2Show += textdisplay[i-1][a968.selectedIndex]; //Ligger data i variablen Text2Show data = "ja"; } } if(data == "nej"){ //Hvis der ingen er valgt, skal der intet stå?. Text2Show = "Ingen bemærkninger"; } if(document.all){ //Hvis IE. descriptions.innerHTML=Text2Show; }else if(document.getElementById){ //Hvis Netscape. document.getElementById("descriptions").innerHTML=Text2Show; } } </script>
---Kode slut---
Er første gang jeg paster kode her, så håber det står nogenlunde.
Jow, så ville den faktisk være temmelig simpel :), men hvis det er en bestillings formular, og de vælger frikadeller i den ene menu og kartoffelsalat i den anden. Så den skal vel både skrive at det er kalkun kød der bruges, og kartoflerne er fra samsø?.
Men altså, eller er det sådan her (bemærk at både dine selects og funktion displaydesc er ændret)
---Kode--- <form name="a294" > <table border="0" cellpadding="0" cellspacing="0" width="500"> <tr><td><table border="0" cellpadding="0" cellspacing="0" width="100%"> <tr><td>Valg 1:</td><td>Valg 2:</td><td>Valg 3:</td><td>Valg 4:</td><td>Valg 5:</td> </tr><tr><td width="100%"> <select name="a969_1" size="1" onChange="displaydesc(1, document.a294.a969_1.selectedIndex);"> <option selected value=""></option> <option value="">Valg 1 - Tekst 1</option> <option value="">Valg 1 - Tekst 2</option> <option value="">Valg 1 - Tekst 3</option> <option value="">Valg 1 - Tekst 4</option> </select></td><td> <select name="a969_2" size="1" onChange="displaydesc(2, document.a294.a969_2.selectedIndex);"> <option selected value=""></option> <option value="">Valg 2 - Tekst 1</option> <option value="">Valg 2 - Tekst 2</option> <option value="">Valg 2 - Tekst 3</option> <option value="">Valg 2 - Tekst 4</option> </select></td><td> <select name="a969_3" size="1" onChange="displaydesc(3, document.a294.a969_3.selectedIndex);"> <option selected value=""></option> <option value="">Valg 3 - Tekst 1</option> <option value="">Valg 3 - Tekst 2</option> <option value="">Valg 3 - Tekst 3</option> <option value="">Valg 3 - Tekst 4</option> </select></td><td> <select name="a969_4" size="1" onChange="displaydesc(4, document.a294.a969_4.selectedIndex);"> <option selected value=""></option> <option value="">Valg 4 - Tekst 1</option> <option value="">Valg 4 - Tekst 2</option> <option value="">Valg 4 - Tekst 3</option> <option value="">Valg 4 - Tekst 4</option> </select></td><td> <select name="a969_5" size="1" onChange="displaydesc(5, document.a294.a969_5.selectedIndex);"> <option selected value=""></option> <option value="">Valg 5 - Tekst 1</option> <option value="">Valg 5 - Tekst 2</option> <option value="">Valg 5 - Tekst 3</option> <option value="">Valg 5 - Tekst 4</option> </select></td></tr></table></td></tr> <tr><td><br><br>Teksten:</td></tr> <tr><td><span id="descriptions" align="left"><br><br> </td></tr></table> </form> <script> //De næste linier laver 2 dimensionelt array, og det vises på 2 forskellige måder. var textdisplay=new Array(); textdisplay[0]= new Array("","Valg 1 - Tekst 1","Valg 1 - Tekst 2","Valg 1 - Tekst 3","Valg 1 - Tekst 4"); textdisplay[1]= new Array("","Valg 2 - Tekst 1","Valg 2 - Tekst 2","Valg 2 - Tekst 3","Valg 2 - Tekst 4"); textdisplay[2]= new Array("","Valg 3 - Tekst 1","Valg 3 - Tekst 2","Valg 3 - Tekst 3","Valg 3 - Tekst 4"); textdisplay[3]= new Array("","Valg 4 - Tekst 1","Valg 4 - Tekst 2","Valg 4 - Tekst 3","Valg 4 - Tekst 4"); textdisplay[4]= new Array(); textdisplay[4][0] = ""; textdisplay[4][1] = "Valg 5 - Tekst 1"; textdisplay[4][2] = "Valg 5 - Tekst 2"; textdisplay[4][3] = "Valg 5 - Tekst 3"; textdisplay[4][4] = "Valg 5 - Tekst 4";
function displaydesc(selectNr, optionNr){ var Text2Show = "", data = "nej"; Text2Show += "Bemærk venligst at: <br>";
if(optionNr != 0){ //Hvis den øverste ikke er valgt, skal den smide text ind. Text2Show += textdisplay[selectNr][optionNr]; //Ligger data i variablen Text2Show data = "ja"; } if(data == "nej"){ //Hvis der ingen er valgt, skal der intet stå?. Text2Show = "Ingen bemærkninger"; } if(document.all){ //Hvis IE. descriptions.innerHTML=Text2Show; }else if(document.getElementById){ //Hvis Netscape. document.getElementById("descriptions").innerHTML=Text2Show; }
Kom lige til at tænke på, at hvis du nu har valgt 3 af menuerne, og du fravælger den ene, så vil der intet stå i bemærkninger, selvom den vel burde vise den forrige bemærkning?.
Jeg kan lave det til dig imorgen, hvis du skal bruge det.
Det ville være helt genialt hvis du kunne lave det på den måde!
____
Kom lige til at tænke på, at hvis du nu har valgt 3 af menuerne, og du fravælger den ene, så vil der intet stå i bemærkninger, selvom den vel burde vise den forrige bemærkning?.
Jeg kan lave det til dig imorgen, hvis du skal bruge det.
Hey, jeg fik lige lidt tid til at kigge på det, og det var faktisk en sjov udfordring at lave lidt historik i det også.
Bemærk at du skal erstatte den gamle funktion med denne, plus linien med "var numre". ---Kode--- var numre = new Array(); function displaydesc(selectNr, optionNr){ var Text2Show = "", data = "nej"; Text2Show += "Bemærk venligst at: <br>"; if(optionNr != 0){ //Hvis den øverste ikke er valgt, skal den smide text ind. Text2Show += textdisplay[selectNr-1][optionNr]; //Ligger data i variablen Text2Show numre[numre.length] = selectNr; data = "ja"; }else{ //Vis den forrige valgte. var length = numre.length, sidste = 0; for(var i = 0;i<=length;i++){ sidste = length - i - 1; if(sidste < 0){ //Hvis sidste er under 0, opstår der fejl da array starter på 0. }else{ var a968 = eval("document.a294.a969_" + numre[sidste]); //Laver et objekt med den sidst valgte select box. if(a968.selectedIndex != 0){ //hvis den sidstvalgte selectbox ikke er 0, skal den vise data, ellers gå videre til næste. Text2Show += textdisplay[numre[sidste]-1][a968.selectedIndex]; //Ligger data i variablen Text2Show i = length+1; //Gør i større, så den stopper loop. data = "ja"; } } } } if(data == "nej"){ //Hvis der ingen er valgt, skal der intet stå?. Text2Show = "Ingen bemærkninger"; } if(document.all){ //Hvis IE. descriptions.innerHTML=Text2Show; }else if(document.getElementById){ //Hvis Netscape. document.getElementById("descriptions").innerHTML=Text2Show; } } ---Kode slut---
Er det sådan du vil have det? Og hvis du finder en fejl, er du velkommen til at skrive, men jeg har dog testet lidt. :)
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.