[JS forms] Iterare Array Associativo di input

[lucavizzi]

"elements" non è altro che un array, i cui indici sono composti dai name dei campi del modulo.
Se più elementi del form hanno lo stesso name, ad esempio: "el_name", elements['el_name'] conterrà a sua volta un array con tutti gli oggetti del DOM con quel name.

Nell'array "elements" quindi, il name/indice "mycheck[primo]" è diverso dal name/indice "mycheck[secondo]"
ecco perché document.forms['myform'].elements[ 'mychecks[]' ]; non funziona se cambi i name delle checkbox.

Per individuare, all'interno del modulo, degli elementi con names non uguali, bisogna usare altri "elementi di aggregazione", che variano da modulo a modulo.

Questo esempio utilizza sempre l'array "elements" e filtra le checkbox in base al loro name:

//tutti gli elementi del form
var el_list = document.forms['myform'].elements; 

//array che conterrà le checkbox
var check_list=[]; 

//scorro gli elementi del modulo "myform"
for(var i=0; i<el_list.length; i++){
    
    //se il name dell'input contiene la stringa 'mychecks'
    if(el_list[i].name.indexOf('mychecks')>-1){

        check_list.push(el_list[i]); //aggiungo il checkbox all'array check_list

    }
    
     /*per la verifica avrei potuto usare l'attributo type: 
    if(el_list[i].type=='checkbox')
    nel caso in cui le checkbox da selezionare siano le uniche checkbox nel modulo
    oppure altri criteri come, ad esempio, una classe o un data-attribute*/

}

Un'alternativa, utilizzando il DOM3, potrebbe essere:

var check_list = document.querySelectorAll('input[name^="mychecks"]');

Oppure con jQuery:

var check_list = $('input[name^="mychecks"]');

Notare l'identica sintassi tra jQuery e l'ultima versione del DOM che, a quanto pare, ha preso a piene mani da jQuery.