Javascript - Kontrollkästchen und übergeben Werte obwohl GET (kein PHP)

Question

Ich versuche, ein Formular mit Kontrollkästchen zu verwenden, und wenn übergibt das Formular übergibt die Auswahl über GET. Mein Problem ist, dass mein Projekt verlangt, dass ich diese Werte ohne PHP und nur Javascript verarbeiten muss. Wenn ich das angehängte Skript verwende, verarbeitet es nur das letzte, nicht das erste. Im Folgenden finden Sie das Formular mit den Kontrollkästchen:

<fieldset id="fruitsVegetables[]"> 
    <div class="foodObject"> 
     <b>Fresh Baby Carrots</b><br> 
     <input class="pepLightCheckboxinput" id="BabyCarrots" type="checkbox" name="fruitsVegetables[]" value="BabyCarrots"> 
     <label for="BabyCarrots"> 
      <span><span></span></span>Choose 
     </label> 
    </div> 

    <div class="foodObject"> 
     <b>Assorted Fresh Fruit</b><br> 
     <input class="pepLightCheckboxinput" id="AssortedFruit" type="checkbox" name="fruitsVegetables[]" value="AssortedFruit"> 
     <label for="AssortedFruit"> 
      <span><span></span></span>Choose 
     </label> 
    </div> 

    <div class="foodObject"> 
     <b>Assorted Fruit Cups</b><br> 
     <input class="pepLightCheckboxinput" id="AssortedFruitCups" type="checkbox" name="fruitsVegetables" value="AssortedFruitCups"> 
     <label for="AssortedFruitCups"> 
      <span><span></span></span>Choose 
     </label> 
    </div> 
</fieldset> 

Hier ist meine bestehende Javascript, dass ich die Variablen verarbeiten bin mit:

var fruitsVegetables1 = getUrlVars()["fruitsVegetables[]"]; 
var fruitsVegetables2 = getUrlVars()["fruitsVegetables[]"]; 

function getUrlVars() { 
    var vars = {}; 
    var parts = window.location.href.replace(/[?&]+([^=&]+)=([^&]*)/gi, function(m,key,value) { 
     vars[key] = value; 
    }); 
    return vars; 
} 

console.log(fruitsVegetables1); 
console.log(fruitsVegetables2); 

Answer 1

Ein JavaScript-Objekt nur eine Eigenschaft für eine bestimmte Eigenschaft Namen haben. Das heißt, es kann nur eine Eigenschaft mit dem Namen "fruitsVegetables []" haben, wenn also zum wiederholten Mal für denselben Wert von key aufgerufen wird, ersetzt es den zuvor eingestellten Wert.

Vielleicht sollten Sie Ihre Funktion ändern, um stattdessen ein Array zurückzugeben. Es könnte auch ein Array nur der Werte für einen bestimmten Parameternamen sein.

var fruitsVegetablesArray = getUrlParamValues("fruitsVegetables[]"); 

function getUrlParamValues(paramName) { 
    var values = []; 
    window.location.href.replace(/[?&]+([^=&]+)=([^&]*)/gi, function(m,key,value) { 
     if (key == paramName) { 
      values.push(value); 
     } 
    }); 
    return values; 
}