Javascript mehrere Checkboxen automatisch addieren

Einklappen
X
 
  • Filter
  • Zeit
  • Anzeigen
Alles löschen
neue Beiträge

  • Javascript mehrere Checkboxen automatisch addieren

    Hallo,
    sorry, dass ich gleich mit einer Frage auftauche. Ich habe mehret Checkboxen und möchte, dass ich die Beträge in value addieren. Es funktioniert, aber wenn ich dann wieder eine andere Checkbox davor auswähle, wird diese wieder addiert. Ich hoffe, dass ich mich halbwegs verständlich ausgedrückt habe und mir jemand gütigerweise hilft.

    Hier der Code:
    PHP-Code:
    <script type="text/javascript">
    function 
    updatePreis(neuerPreis)
    {
    alterWert parseFloat(document.getElementById("preis").value);
    neuerWert parseFloat(neuerPreis);
    document.getElementById("preis").value = (alterWert +
    neuerWert).toString();
    }

    </
    script
    HTML-Code:
    <form name="Konfigurator" action="cover-select">
               
                <div id="cartItems" class="cartBox">
                  <p><span id="deliveryTitle" class="title">Hier können Sie auswählen, ob Sie ihr Cover personalisieren möchten.</span></p>
                  <p>&nbsp; </p>
                  <div class="cartDeliveryCont"><fieldset id="deliveryContainer" class="container">
                
                <div id="shippingContribstandard"><span class="contribButton">
                
                <label for="delivery1"></span><span class="contribInfo"><input type="hidden" name="cover1" 
    value="Cover ohne Personalisierung" id="cover-select1" class="hidden"/>Cover ohne Personalisierung</span><div class="contribDefaultPrice">
                 
    			<input type="radio" name="cover" value="0" id="cover0" class="radio" onChange="updatePreis(cover0.value);" 
    checked=""/><span>EUR 0,00</span></label></div></div>
                
                <div id="shippingContribstandard"><span class="contribButton">
                
                <label for="delivery1"></span><span class="contribInfo"><input type="hidden" name="cover2" value="Personalisierung mit Logo" 
    id="cover-select2" class="hidden"/>Personalisierung mit Logo</span><div class="contribDefaultPrice">
                 
    			<input type="radio" name="cover" value="5" id="cover5" class="radio" onChange="updatePreis(cover5.value);"/><span>
    EUR 5,00</span></label></div></div>
                
                <div class="contribution" id="shippingContribexpress"><span class="contribButton">
                
                <label for="delivery2"></span><span class="contribInfo"><input type="hidden" name="cover33" value="Personalisierung mit Foto" 
    id="cover-select3" class="hidden"/>Personalisierung mit Foto</span><div class="contribDefaultPrice">
                 
    			<input type="radio" name="cover" value="10" id="cover10" class="radio" onChange="updatePreis(cover10.value);"/><span>
    EUR 10,00</span></label></div></fieldset><span class="clear"></span></div></div>
                
            </form>
    
    <form name="Konfigurator" action="delivery">
                <span class="titleContent">Versandart</span></div> <div class="cartDeliveryCont"><fieldset id="deliveryContainer" class="container">
                
                <div class="contribution selected" id="shippingContribstandard"><span class="contribButton">
                
                <label for="delivery1"><span>Standard</span></span><span class="contribInfo"><input type="hidden" name="delivery1" 
    value="Lieferung innerhalb von 4-6 Arbeitstagen" id="delivery1" class="hidden"/>Lieferung innerhalb von 4-6 Arbeitstagen</span><div class="contribDefaultPrice">
                 
    			<input type="radio" name="delivery" value="7" id="delivery7" class="radio" onChange="updatePreis(delivery7.value);" 
    checked=""/><span>EUR 7,00</span></label></div></div>
     <div class="contribution" id="shippingContribexpress"><span class="contribButton">
                
                <label for="delivery2"><span>Express</span></span><span class="contribInfo"><input type="hidden" name="delivery2" 
    value="Lieferung innerhalb von 2-3 Arbeitstagen" id="delivery4" class="hidden"/>Lieferung innerhalb von 2-3 Arbeitstagen</span>
    <div class="contribDefaultPrice">
                 
    			<input type="radio" name="delivery" value="5" id="delivery13" class="radio" onChange="updatePreis(delivery13.value);"/>
    <span>EUR 13,00</span></label></div></div></fieldset></div><br /><br /><br />
    </form>
    <div id="orderTotal"><br /><br />
                    
                  <span class="priceTotal">Gesamtbetrag</span><span style="float:right">EUR<input id="preis" name"preis" type="text" value="37" 
    style="font-weight:bold; color:black;"></span></div>
    Zuletzt geändert von Kludde77; 04.01.2012, 10:09.

  • #2
    Du musst halt vorher prüfen, ob die Checkbox aktiviert oder deaktiviert wurde, dann ist es eine Addition oder eine Subtraktion. Oder du gehst di Checkboxen jedes Mal alle durch und addierst nur die aktivierten.

    Kommentar


    • #3
      Bitte brich vorher deinen Code um! Kein Mench scrollt gerne horizontal.

      Danke
      Peter
      Nukular, das Wort ist N-u-k-u-l-a-r (Homer Simpson)
      Meine Seite

      Kommentar


      • #4
        Zitat von Kropff Beitrag anzeigen
        Bitte brich vorher deinen Code um! Kein Mench scrollt gerne horizontal.

        Danke
        Peter
        Danke, gemacht

        Kommentar


        • #5
          Zitat von chorn Beitrag anzeigen
          Du musst halt vorher prüfen, ob die Checkbox aktiviert oder deaktiviert wurde, dann ist es eine Addition oder eine Subtraktion. Oder du gehst di Checkboxen jedes Mal alle durch und addierst nur die aktivierten.
          Sorry, aber bin nicht so erfahren. Wie kann ich das am Besten vornehmen?
          Danke für deine Hilfe!!

          Kommentar


          • #6
            Dann bau dir doch erstmal eine Schleife die dir alle Checkboxen liefert, prüfe mit alert() ob die Namen richtig sind, sonst filtere nach Klaase oder ähnlichem Merkmal, wie das geht dazu gibt es haufenweise Tutorials bei Google, z.B.

            https://www.google.com/search?q=java...boxen+addieren

            zweiter Eintrag, php.de, JQuery kann dir da auch helfen.

            Kommentar


            • #7
              Hallo,

              deine updatePreis-Funktion hat keinerlei Informationen darüber, ob die Checkbox die sich geändert hat, jetzt aktiviert oder deaktiviert wurde, sondern addiert fröhlich weiter. Wenn du also die 5,-€-Checkbox aktivierst und wieder deaktivierst, sind es schon 10,-€.

              Übergib der Funktion einfach this ([FONT="Courier New"]onclick="updatePrice(this)"[/FONT]) und schreib die updatePrice-Funktion so um, dass sie die Checkbox als Parameter erwartet, dann kannst du in der Funktion mit [FONT="Courier New"]checkbox.checked[/FONT] überprüfen, ob sie aktiv ist und mit [FONT="Courier New"]checkbox.value[/FONT] ihren Wert auslesen.

              Gruß,

              Amica
              [COLOR="DarkSlateGray"]Hast du die [COLOR="DarkSlateGray"]Grundlagen zur Fehlersuche[/color] gelesen? Hast du Code-Tags benutzt?
              Hast du als URL oder Domain-Beispiele example.com, example.net oder example.org benutzt?
              Super, danke!
              [/COLOR]

              Kommentar


              • #8
                Zitat von AmicaNoctis Beitrag anzeigen
                Hallo,

                deine updatePreis-Funktion hat keinerlei Informationen darüber, ob die Checkbox die sich geändert hat, jetzt aktiviert oder deaktiviert wurde, sondern addiert fröhlich weiter. Wenn du also die 5,-€-Checkbox aktivierst und wieder deaktivierst, sind es schon 10,-€.

                Übergib der Funktion einfach this ([FONT="Courier New"]onclick="updatePrice(this)"[/FONT]) und schreib die updatePrice-Funktion so um, dass sie die Checkbox als Parameter erwartet, dann kannst du in der Funktion mit [FONT="Courier New"]checkbox.checked[/FONT] überprüfen, ob sie aktiv ist und mit [FONT="Courier New"]checkbox.value[/FONT] ihren Wert auslesen.

                Gruß,

                Amica
                Hallo Amica,
                danke für deine Hilfe, leider probiere ich jetzt schon seit 2 Stunden rum, leider aber ohne sinnvolles Ergebnis. Hättest du vielleicht erbarmen mit mir und könntest mir ein wenig weiterhelfen?
                Danke
                lg
                Kludde

                Kommentar


                • #9
                  Als ich noch dachte, dass es um Checkboxen ging, wie du sagtest, schwebte mir sowas hier vor:

                  Code:
                  function updatePreis (checkbox) {
                      var neuerPreis = checkbox.value - 0;
                      if (checkbox.checked) {
                          neuerPreis = -neuerPreis;
                      }
                      // hier dein anderer Code
                  }
                  Aufruf über onchange="updatePreis(this)"

                  Da ich aber im Code eben gesehen habe, dass es Radiobuttons sind, weiß ich grad nicht, ob das so in allen Browsern funktioniert, also ob der onchange-Event auch beim Abwählen des bisherigen Knopfes feuert. Notfalls musst du wirklich alle durchgehen und gucken, welcher aktiv ist (document.getElementsByName("cover")).
                  [COLOR="DarkSlateGray"]Hast du die [COLOR="DarkSlateGray"]Grundlagen zur Fehlersuche[/color] gelesen? Hast du Code-Tags benutzt?
                  Hast du als URL oder Domain-Beispiele example.com, example.net oder example.org benutzt?
                  Super, danke!
                  [/COLOR]

                  Kommentar

                  Lädt...
                  X