Vraag & Antwoord

Webprogrammeren & scripting

Bestelformulier code inkorten

2 antwoorden
  • Hoi Allemaal, ik ben bezig met een bestelformulier en zit met een vraag. tot nu toe heb ik dit: [code:1:b378ee1c18] <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>Test Bestellijst</title> <meta http-equiv="content-type" content="text/html;charset=UTF-8" /> <link href="Style.css" type="text/css" rel=StyleSheet> <script language="JavaScript" type="text/javascript"> <!-- function vlinder(){ var box1 = 0.30; var box2 = eval(document.Bestellen.V1.value); prijs = box1 * box2; prijs = prijs.toFixed(2); document.Bestellen.V2.value = prijs;} function bloem(){ var box1 = 0.30; var box2 = eval(document.Bestellen.B1.value); prijs = box1 * box2; prijs = prijs.toFixed(2); document.Bestellen.B2.value = prijs;} function koek(){ var box1 = 0.30; var box2 = eval(document.Bestellen.KM1.value); prijs = box1 * box2; prijs = prijs.toFixed(2); document.Bestellen.KM2.value = prijs;} function optellen(){ var box1 = eval(document.Bestellen.V2.value); var box2 = eval(document.Bestellen.B2.value); var box3 = eval(document.Bestellen.KM2.value); if (isNaN(box1) && isNaN(box2) && isNaN(box3)) { document.Bestellen.Resultaat.value = 0.00; alert ("Je hebt niks ingevuld!");} else if (isNaN(box1) && isNaN(box2)) { box1 = 0; box2 = 0; som = box1 + box2 + box3; som = som.toFixed(2); document.Bestellen.Resultaat.value = som;} else if (isNaN(box2) && isNaN(box3)) { box2 = 0; box3 = 0; som = box1 + box2 + box3; som = som.toFixed(2); document.Bestellen.Resultaat.value = som;} else if (isNaN(box1) && isNaN(box3)) { box1 = 0; box3 = 0; som = box1 + box2 + box3; som = som.toFixed(2); document.Bestellen.Resultaat.value = som;} else if (isNaN(box1)) { box1 = 0; som = box1 + box2 + box3; som = som.toFixed(2); document.Bestellen.Resultaat.value = som;} else if (isNaN(box2)) { box2 = 0; som = box1 + box2 + box3; som = som.toFixed(2); document.Bestellen.Resultaat.value = som;} else if (isNaN(box3)) { box3 = 0; som = box1 + box2 + box3; som = som.toFixed(2); document.Bestellen.Resultaat.value = som;} else { som = box1 + box2 + box3; som = som.toFixed(2); document.Bestellen.Resultaat.value = som;}} //--> </script> </head> <body> <div id="Content"> <form name="Bestellen"> <table> <tr> <td>Naam</td> <td>Prijs in €</td> <td>Aantal</td> <td>Totaal</td> </tr> <tr> <td>Vlinder</td> <td>0,30</td> <td><input name="V1" type="text" size="5" maxlength="5" onChange="vlinder(); optellen();" /></td> <td><input name="V2" type="text" size="5" /></td> </tr> <tr> <td>Bloem</td> <td>0,30</td> <td><input name="B1" type="text" size="5" maxlength="5" onChange="bloem(); optellen();" /></td> <td><input name="B2" type="text" size="5" /></td> </tr> <tr> <td>Koekie monster</td> <td>0,30</td> <td><input name="KM1" type="text" size="5" maxlength="5" onChange="koek(); optellen();" /></td> <td><input name="KM2" type="text" size="5" /></td> </tr> <tr> <td> </td> <td><input type="reset" value="Reset"></td> <td><input type="button" onClick="return optellen();" value="Totaal:" /></td> <td><input name="Resultaat" type="text" value="" size="5" /></td> </tr> </table> </form> </div> </body> </html> [/code:1:b378ee1c18] die vlinder, bloem en koekie monster zijn traktaties die uitgedeeld kunnen worden ik een klas. het is de bedoeling dat de site-bezoeker per item het aantal invult en dat al het rekenwerk automatisch wordt uitgevoerd en ingevuld op de juiste plaats. nou is mijn vraag of de code niet wat korter of handiger kan. want zoals het hier staat werkt alles perfect, maar als ik regels toe wil voegen aan de tabel, (en dus ook aan de code), gaat dat heel omslachtig worden. tot nu toe moet de uiteindelijke tabel 15 items gaan tellen, maar dat zou natuurlijk nog meer kunnen worden.
  • Zo op het eerste gezicht is er inderdaad wel een aantal verbeteringen aan te brengen die de code ongetwijfeld korter zal maken. Ten eerste zou ik met één generieke functie werken die onder andere de twee variabelen "stukprijs" en "aantal" meekrijgt om op die manier de totale prijs per traktatie uit te rekenen. Ook je code om te controleren of er wel een getal is ingevuld is nodeloos uitgebreid, hier zou een simpele functie die over alle (numerieke) invoervelden itereert meer op z'n plaats zijn. Ik hoop dat je hier iets mee kan, als je tegen problemen aanloopt horen we het wel. ;) - Bas

Beantwoord deze vraag

Weet jij het antwoord op deze vraag? Registreer of meld je aan met je account

Dit is een gearchiveerde pagina. Antwoorden is niet meer mogelijk.