[JS] Variable waarde gebruiken als variabele naam

[Eijkb]

Probleem:

Een formulier met een aantal vragen waarbij de antwoorden gegeven kunnen worden als één of meerdere checkboxes.

Het name-attribuut van de checkboxes is bv. name="kleur[]" om zodoende serverside deze waardes in een array op te vangen.

Nu wil ik via jquery de values van de "gecheckte" checkboxes weergeven:

JavaScript:

var ARR = new Array();
                                    
$("input:checkbox")
  .button()   
  .click( function() {                      
      ARR[this.name] = new Array();
      $("input[@name='"+this.name+"']:checked").each(function() { 
           ARR[this.name].push($(this).val());});
           ARR[this.name].shift();
           $('#v'+this.name).val(ARR[this.name].join(','));
      } 
);

Het probleem: Ik wil dus de waarde van "this.name" gebruiken als key (of naam array) zodat deze code kan gelden voor meerdere vragen (allen met hun eigen reeks checkboxes).

Wanneer ik ARR gebruik (zonder [this.name]) werkt het, met dien verstande dat het weergeven binnen bv. een txt value* de waarde van alle gecheckte checkboxes getoond worden, ook die van vraag 2, 3 etc.

(* zie laatste regel, txt velden heten v + this.name waarbij this.name uiteraard de waarde is van name="" van de rij checkboxes)

Iemand een idee? In PHP kan je bv:

PHP:

$var = "voorbeeld";
$array[$var] = "waarde";

echo $array['voorbeeld'];

of

PHP:

$var = "voorbeeld";
${"$var"] = "waarde";

echo $voorbeeld;

gebruiken. Is zoiets mogelijk in Javascript?

Mijn pogingen:

var = this.name;
ARR[var]

én

$ARR["'+this.name'"]

en nog wat varianten maar hij pakt het niet.

[Bosmonster]

Waarom gebruik je:

JavaScript:

$("input[@name='"+this.name+"']:checked")

En niet gewoon

JavaScript:

$(this).attr('checked')

Nu zit je in het element en ga je het vervolgens nog een keer opzoeken op een naam die al niet uniek is.

edit: even de checked toegevoegd

Ik snap niet zo goed wat je nu wilt eigenlijk..

Overigens is die @ in je attribute-selector overbodig (en met latere jQuery versies zelfs fout).

[ Voor 30% gewijzigd door Bosmonster op 16-09-2010 16:57 ]

[Eijkb]

$(this) refereert naar niets, ik heb $(this.name) geprobeerd wat eenzelfde fout geeft: undefined.

Mijn formulier wordt gegenereerd vanuit PHP:

HTML:

<label for="kleur1">ZWART</label>
<input type="checkbox" id="kleur1" name="kleur[]" value="zwart" />
                 
<label for="kleur2">WIT</label>
<input type="checkbox" id="kleur2" name="kleur[]" value="wit" />

<label for="soort1">LICHT</label>
<input type="checkbox" id="soort1" name="soort[]" value="licht" />

<label for="soort2">DONKER</label>
<input type="checkbox" id="soort2" name="soort[]" value="donker" />

De waardes welke gechecked zijn wil ik dus in javascript in een array met de naam "kleur" en "soort". Deze array-namen kan ik niet van te voren definieren, gezien het er ontelbaar zijn en tevens veranderen.

Vandaar dat ik graag in javascript een array wil aanmaken met bv:

JavaScript:

ARR[this.name] = array('donker');
ARR[this.name] = array('licht');

zodat ARR[soort] de waarde "donker" en "licht" krijgt welke ik in een loop aan kan roepen met

JavaScript:

$(#div).html(ARR[this.name].join(','));

Buiten het feit dat this.name de bv. waarde "soort[]" heeft kan ik geen id gebruiken, deze moet uniek zijn (volgens de standaarden).

[.oisyn]

Ik zie sowieso niet wat je nou eigenlijk probeert te doen. Als ik ten eerste even je vage indenting fix:

JavaScript:

$("input:checkbox") 
    .button()       
    .click( function() {                               
        ARR[this.name] = new Array(); 
        $("input[@name='"+this.name+"']:checked").each(function() {  
            ARR[this.name].push($(this).val());
        }); 
        ARR[this.name].shift(); 
        $('#v'+this.name).val(ARR[this.name].join(',')); 
    });

De this op regel 5 is niet meer de this in de click functie. De this verwijst op dat moment naar het element waarvoor de each() wordt aangeroepen.

.edit: oh wacht, dat maakt natuurlijk ook niet uit, want je enumereert toch over alle elementen met dezelfde naam.

[ Voor 15% gewijzigd door .oisyn op 16-09-2010 17:39 ]

[Bosmonster]

Ah die indenting verklaart een hoop

Maar snap het nog steeds niet...

[.oisyn]

Eijkb schreef op donderdag 16 september 2010 @ 17:13:
De waardes welke gechecked zijn wil ik dus in javascript in een array met de naam "kleur" en "soort". Deze array-namen kan ik niet van te voren definieren, gezien het er ontelbaar zijn en tevens veranderen.

Wat natuurlijk onzin is. Als je je HTML dynamisch kan genereren kun je die javascript array ook genereren.

Verder snap ik niet wat je probleem nou is. ARR[this.name] zou gewoon moeten werken. Eigenljik klopt je code verder ook wel, muv de shift(), die kan ik nog steeds niet plaatsen.

[Eijkb]

De rest van de code is eigenlijk ook niet belangrijk voor het eigenlijke probleem, hoopte alleen dat het wat zou verduidelijken, maar blijkbaar niet.

Feitelijk geven de PHP regels in mijn TS het probleem weer. Ik wil hetzelfde doen in JS en dat lukt me niet:

PHP:

$var = "voorbeeld";
$array[$var] = "waarde";

echo $array["voorbeeld"]; // geeft waarde weer.

[ Voor 3% gewijzigd door Eijkb op 16-09-2010 17:56 ]

[.oisyn]

Werkt precies zo in javascript

.edit: d'Oh, de reden dat het niet werkt is natuurlijk dat "#vkleur[]" geen goede selector is. Die haakjes parset hij natuurlijk niet als onderdeel van de id. En de shift moet weg. Dit werkt: http://jsfiddle.net/HR9fq/

[ Voor 78% gewijzigd door .oisyn op 16-09-2010 18:17 ]