11. marts 2005 - 10:45
Der er
17 kommentarer og 1 løsning
dynamisk beregning af pris
Jeg har følgende problem: Jeg opretter en bestillingsseddel dynamisk udfra en database. For hver artikel der ligger i databasen laver jeg en checkbox, og et indtastningsfelt for antal. Nu vil jeg gerne have det sådan, at antalsfeltet er skjult edmindre tjekboxen markeres. Derudover vil jeg gerne have et felt til samlet pris i bunden af siden. Således at hver gang en bruger tjekker en artikel af og indtaster et antal, så opsummeres prisen i bunden. Ligeledes skal prisen fratrækkes igen hvis markeringen fjernes i i en af tjekboxene. Min kode er foreløbig sådan: <head> <SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript"> function calc(id,pris){ var felt = eval('form1.antal_' + id ); var total = eval('form1.total'); stkpris = parseInt(felt.value); total_nu = parseInt(total.value); pris_ialt = stkpris * pris document.form1.total.value = total_nu + pris_ialt,2; } function vindue(url,sti) { var side; side = url + "?billede=" + sti window.open(side, '', "scroll, resizable, z-index=1,top=0,left=0") } </script> </head> <body> <form name="form1" method="POST" onsubmit='return check(this)' action=""> <table border="0" cellpadding="0" cellspacing="0" width="100%" class="tekst"> <tr> <td width="100%" colspan="4"><img border="0" src="../images/horisontalDot_small.gif"></td> </tr> <%sql = "SELECT * FROM artikler" Set Arr = Connect_bestil.Execute(sql) do until Arr.eof%> <tr> <td width="100%" colspan="4"><img border="0" src="../images/5x5.gif"></td> </tr> <tr> <td width="25" valign="top"><input type="checkbox" name="art_<%=Arr("id")%>" value="ON"></td> <td valign="top"><b><%=Arr("navn")%></b></td> <td valign="top"></td> <td valign="top"><div id="div_<%=Arr("id")%>" name="antal_<%=Arr("id")%>" style="visibility:visibel"><p align="right">Antal: <input type="text" onChange="calc(<%=Arr("id")%>,<%=Arr("pris")%>);" name="antal_<%=Arr("id")%>" size="5" class="felt"></div></td> </tr> <tr> <td valign="top"></td> <td valign="top" colspan="3"> <table border="0" cellpadding="0" cellspacing="0" width="100%" class="tekst"> <tr> <% if Arr("billede") <> "" then%> <td width="115" valign="top"><a href="java script: vindue('bestilling_vis_billede.asp','../log/bestilling/<%=Arr("billede")%>');"><img name="img_<%=Arr("id")%>" border="0" src="../log/bestilling/<%=Arr("billede")%>" width="100"></td> <td valign="top"><%=Arr("beskrivelse")%><p>Artikelnummer: <%=Arr("id")%><br>Pris pr. stk.: <% if Arr("pris")= 0 then Response.Write "Gratis" else Response.Write FormatNumber(Arr("pris"),2) & " kr." end if%></p></td> <%else%> <td colspan="2" valign="top"><%=Arr("beskrivelse")%><p>Artikelnummer: <%=Arr("id")%><br>Pris pr. stk.: <% if Arr("pris")= 0 then Response.Write "Gratis" else Response.Write FormatNumber(Arr("pris"),2) & " kr." end if%></p></td> <%end if%> </tr> </table> </td> <td valign="top"></td> </tr> <tr> <td width="100%" colspan="4"><img border="0" src="../images/horisontalDot_small.gif"><br> </td> </tr> <%Arr.MoveNext loop Arr.Close Set Arr = nothing%> <tr> <td width="100%" colspan="4"> <table border="0" cellpadding="0" cellspacing="0" width="100%" class="tekst"> <tr> <td width="50%"><b>Samlet pris for bestilling:</b></td> <td width="50%"> <p align="right"><input type="text" name="total" size="5" class="felt" value="0,00"></p> </td> </tr> <tr> <td width="100%" colspan="2"> </td> </tr> </table> </td> </tr> <tr> <td width="100%" colspan="4"><input type="submit" value="Bestil" name="Submit" class="knap"> </td> </tr> </table> </form> </body> Er der nogen der kan hjælpe mig med at få det til at fungere?
Annonceindlæg fra Barco
11. marts 2005 - 11:15
#1
Du skal udvide dit javascript med en funktion mere: function showHideNum(cb){ document.getElementById(cb.name.replace(/^art_/,"div_")).style.visibility = (cb.checked)?'visible':'hidden'; } -- og ændre din kode her: <tr> <td width="25" valign="top"><input type="checkbox" name="art_<%=Arr("id")%>" value="ON" onclick="showHideNum(this);"></td> <td valign="top"><b><%=Arr("navn")%></b></td> <td valign="top"></td> <td valign="top"><div id="div_<%=Arr("id")%>" name="antal_<%=Arr("id")%>" style="visibility:hidden;"><p align="right">Antal: <input type="text" onChange="calc(<%=Arr("id")%>,<%=Arr("pris")%>);" name="antal_<%=Arr("id")%>" size="5" class="felt"></div></td> </tr> -- men det der med at ændre sammentællingen kan ikke lade sig gøre, da det antal, som prisen er beregnet ud fra, jo muligvis er anderledes end den gang prisen blev beregnet ... -- så jeg ville anbefale, at du i stedet hver gang, der var mulighed for en ændring af summen, simpelthen regnede helt forfra !-)
11. marts 2005 - 11:52
#2
ja det ville også være smart, men hvordan laver jeg beregn funktionen, så den medtager alle felterne?
11. marts 2005 - 12:14
#3
Så må du indsætte prisen i et element, vi kan finde !-) F.eks. <td valign="top"><%=Arr("beskrivelse")%><p>Artikelnummer: <%=Arr("id")%><br>Pris pr. stk.: <% if Arr("pris")= 0 then Response.Write "Gratis" else Response.Write FormatNumber(Arr("pris"),2) & " kr." end if%><input type="hidden" value="<%=Arr("pris")%>" name="pris_<%=Arr("id")%>"></p></td> -- og så bliver funktionen sådan noget lignende: function calc(frm){ var tot = 0,pris,antal; var elms = frm.elements; for(i=0;elms.length>i;i++){ if(elms[i].type == 'checkbox'&&elms[i].checked){ pris = parseFloat(frm.elements[elms[i].name.replace(/art_/,"pris_")].value); antal = perseFloat(frm.elements[elms[i].name.replace(/art_/,"antal_")].value); tot += pris*antal; } } frm.total.value = tot; } -- og onchange på felterne, samt andre steder i formen, du måtte have brug for at beregne: onchange="calc(this.form);"
11. marts 2005 - 12:42
#4
hmmm - nu brokker den sig og siger: 'length' er null eller ikke et objekt
11. marts 2005 - 12:44
#5
Har du fået this.form med i kaldet ?-)
11. marts 2005 - 12:54
#6
ups - kigger lige
11. marts 2005 - 13:00
#7
nej det havde jeg ikke. Det har jeg nu, og nu siger den: 'elements[...].value' er null eller ikke et objekt
11. marts 2005 - 13:02
#8
-- har du indsat den der input type="hidden" ?-)
11. marts 2005 - 13:04
#9
jeps det har jeg
11. marts 2005 - 13:06
#10
Kan du vise hvordan koden så ser ud i browseren (vis kilde !-)
11. marts 2005 - 13:10
#11
funktionen: function calc(frm){ var tot = 0,pris,antal; var elms = frm.elements; for(i=0;elms.length>i;i++){ if(elms[i].type == 'checkbox'&&elms[i].checked){ pris = parseFloat(frm.elements[elms[i].name.replace(/art_/,"pris_")].value); antal = perseFloat(frm.elements[elms[i].name.replace(/art_/,"antal_")].value); tot += pris*antal; } } frm.total.value = tot; } Koden: <form name="form1" method="POST" onsubmit='return check(this)' action=""> <table border="0" cellpadding="0" cellspacing="0" width="100%" class="tekst"> <tr> <td width="100%" colspan="4"><img border="0" src="../images/horisontalDot_small.gif"></td> </tr> <tr> <td width="100%" colspan="4"><img border="0" src="../images/5x5.gif"></td> </tr> <tr> <td width="25" valign="top"><input type="checkbox" name="art_1" value="ON" onclick="showHideNum(this);"></td> <td valign="top"><b>Magasinet nr. 1, 2004 </b></td> <td valign="top"></td> <td valign="top"><div id="div_1" name="antal_1" style="visibility:hidden"><p align="right">Antal: <input type="text" onChange="calc(this.form);" name="antal_1" size="5" class="felt"></div></td> </tr> <tr> <td valign="top"></td> <td valign="top" colspan="3"> <table border="0" cellpadding="0" cellspacing="0" width="100%" class="tekst"> <tr> <td width="115" valign="top"><a href="java script: vindue('bestilling_vis_billede.asp','../log/bestilling/2004-1.jpg');"><img name="img_1" border="0" src="../log/bestilling/2004-1.jpg" width="100"></td> <td valign="top">Magasinet indeholder artikler om diverse emner<p>Artikelnummer: 1<br>Pris pr. stk.: Gratis</p></td> </tr> </table> </td> <td valign="top"></td> </tr> <tr> <td width="100%" colspan="4"><img border="0" src="../images/horisontalDot_small.gif"><br> </td> </tr> <tr> <td width="100%" colspan="4"><img border="0" src="../images/5x5.gif"></td> </tr> <tr> <td width="25" valign="top"><input type="checkbox" name="art_2" value="ON" onclick="showHideNum(this);"></td> <td valign="top"><b>Kuglepenne</b></td> <td valign="top"></td> <td valign="top"><div id="div_2" name="antal_2" style="visibility:hidden"><p align="right">Antal: <input type="text" onChange="calc(this.form);" name="antal_2" size="5" class="felt"></div></td> </tr> <tr> <td valign="top"></td> <td valign="top" colspan="3"> <table border="0" cellpadding="0" cellspacing="0" width="100%" class="tekst"> <tr> <td colspan="2" valign="top">med påført SAM-DATA logo<p>Artikelnummer: 2<br>Pris pr. stk.: 5,00 kr.<input type="hidden" value="5" name="pris_2"></p></td> </tr> </table> </td> <td valign="top"></td> </tr> <tr> <td width="100%" colspan="4"><img border="0" src="../images/horisontalDot_small.gif"><br> </td> </tr> <tr> <td width="100%" colspan="4"><img border="0" src="../images/5x5.gif"></td> </tr> <tr> <td width="25" valign="top"><input type="checkbox" name="art_3" value="ON" onclick="showHideNum(this);"></td> <td valign="top"><b>Magasinet nr. x, år xxxx</b></td> <td valign="top"></td> <td valign="top"><div id="div_3" name="antal_3" style="visibility:hidden"><p align="right">Antal: <input type="text" onChange="calc(this.form);" name="antal_3" size="5" class="felt"></div></td> </tr> <tr> <td valign="top"></td> <td valign="top" colspan="3"> <table border="0" cellpadding="0" cellspacing="0" width="100%" class="tekst"> <tr> <td width="115" valign="top"><a href="java script: vindue('bestilling_vis_billede.asp','../log/bestilling/magasin.jpg');"><img name="img_3" border="0" src="../log/bestilling/magasin.jpg" width="100"></td> <td valign="top">Her er lige et magasin mere<p>Artikelnummer: 3<br>Pris pr. stk.: 50,00 kr.</p></td> </tr> </table> </td> <td valign="top"></td> </tr> <tr> <td width="100%" colspan="4"><img border="0" src="../images/horisontalDot_small.gif"><br> </td> </tr> <tr> <td width="100%" colspan="4"><img border="0" src="../images/5x5.gif"></td> </tr> <tr> <td width="25" valign="top"><input type="checkbox" name="art_4" value="ON" onclick="showHideNum(this);"></td> <td valign="top"><b>Stop volden mod kvinder</b></td> <td valign="top"></td> <td valign="top"><div id="div_4" name="antal_4" style="visibility:hidden"><p align="right">Antal: <input type="text" onChange="calc(this.form);" name="antal_4" size="5" class="felt"></div></td> </tr> <tr> <td valign="top"></td> <td valign="top" colspan="3"> <table border="0" cellpadding="0" cellspacing="0" width="100%" class="tekst"> <tr> <td width="115" valign="top"><a href="java script: vindue('bestilling_vis_billede.asp','../log/bestilling/politi.jpg');"><img name="img_4" border="0" src="../log/bestilling/politi.jpg" width="100"></td> <td valign="top">Faglig værktøjskasse for politiet<p>Artikelnummer: 4<br>Pris pr. stk.: 30,00 kr.</p></td> </tr> </table> </td> <td valign="top"></td> </tr> <tr> <td width="100%" colspan="4"><img border="0" src="../images/horisontalDot_small.gif"><br> </td> </tr> <tr> <td width="100%" colspan="4"> <table border="0" cellpadding="0" cellspacing="0" width="100%" class="tekst"> <tr> <td width="50%"><b>Samlet pris for bestilling:</b></td> <td width="50%"> <p align="right"><input type="text" name="total" size="5" class="felt" value="0,00"></p> </td> </tr> <tr> <td width="100%" colspan="2"> </td> </tr> </table> </td> </tr> <tr> <td width="100%" colspan="4"><input type="submit" value="Bestil" name="Submit" class="knap"> </td> </tr> </table> </form>
11. marts 2005 - 13:19
#12
Du skal udskrive den input type=hidden uanset om der er et billede eller ej !-)
11. marts 2005 - 14:27
#13
Det har jeg så gjort nu og så skriver den 'Et objekt var ventet' ved følgende linie i funktionen: antal = perseFloat(frm.elements[elms[i].name.replace(/art_/,"antal_")].value);
11. marts 2005 - 14:30
#14
-- argh, jeg glemte at gøre opmærksom på tavetossen: antal = parseFloat(frm.elements[elms[i].name.replace(/art_/,"antal_")].value);
11. marts 2005 - 14:38
#15
Sådan! Du var lige en frelsende engel der :-) Tusind tak for hjælpen. Kan du ikke lige ligge et svar, så du kan få dine point
11. marts 2005 - 14:40
#16
Velbekomme '-)
11. marts 2005 - 14:44
#17
-- og tak for point ;~}
11. marts 2005 - 14:47
#18
det var så lidt
Vi tilbyder markedets bedste kurser inden for webudvikling