Avatar billede sanne Nybegynder
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:&nbsp;<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>
                          &nbsp;</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">&nbsp;</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?
Avatar billede roenving Novice
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:&nbsp;<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 !-)
Avatar billede sanne Nybegynder
11. marts 2005 - 11:52 #2
ja det ville også være smart, men hvordan laver jeg beregn funktionen, så den medtager alle felterne?
Avatar billede roenving Novice
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);"
Avatar billede sanne Nybegynder
11. marts 2005 - 12:42 #4
hmmm - nu brokker den sig og siger: 'length' er null eller ikke et objekt
Avatar billede roenving Novice
11. marts 2005 - 12:44 #5
Har du fået this.form med i kaldet ?-)
Avatar billede sanne Nybegynder
11. marts 2005 - 12:54 #6
ups - kigger lige
Avatar billede sanne Nybegynder
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
Avatar billede roenving Novice
11. marts 2005 - 13:02 #8
-- har du indsat den der input type="hidden" ?-)
Avatar billede sanne Nybegynder
11. marts 2005 - 13:04 #9
jeps det har jeg
Avatar billede roenving Novice
11. marts 2005 - 13:06 #10
Kan du vise hvordan koden så ser ud i browseren (vis kilde !-)
Avatar billede sanne Nybegynder
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:&nbsp;<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>
                          &nbsp;</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:&nbsp;<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>
                          &nbsp;</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:&nbsp;<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>
                          &nbsp;</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:&nbsp;<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>
                          &nbsp;</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">&nbsp;</td>
                          </tr>
                        </table>
                      </td>
                    </tr>
                    <tr>
                      <td width="100%" colspan="4"><input type="submit" value="Bestil" name="Submit" class="knap">
                      </td>
                    </tr>
                  </table>
                </form>
Avatar billede roenving Novice
11. marts 2005 - 13:19 #12
Du skal udskrive den input type=hidden uanset om der er et billede eller ej !-)
Avatar billede sanne Nybegynder
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);
Avatar billede roenving Novice
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);
Avatar billede sanne Nybegynder
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
Avatar billede roenving Novice
11. marts 2005 - 14:40 #16
Velbekomme '-)
Avatar billede roenving Novice
11. marts 2005 - 14:44 #17
-- og tak for point ;~}
Avatar billede sanne Nybegynder
11. marts 2005 - 14:47 #18
det var så lidt
Avatar billede 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.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

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