Convalida gruppo pulsanti radio dinamici in jQuery

Question

Qual è il modo migliore per verificare che almeno uno in ogni gruppo sia selezionato, quindi nei seguenti esempi di gruppi sono name1, name2, name3?

Esempio

<input type="radio" name="name1"> 
<input type="radio" name="name1"> 
<input type="radio" name="name1"> 

<input type="radio" name="name2"> 
<input type="radio" name="name2"> 
<input type="radio" name="name2"> 

<input type="radio" name="name3"> 
<input type="radio" name="name3"> 
<input type="radio" name="name3"> 

so di poter avvolgere un div intorno ad ogni uno e poi controllare ogni pulsante di scelta nel div, ma cerco per una soluzione più dinamica. Quindi, se in futuro verranno aggiunti più pulsanti radio, il codice jQuery non dovrà essere modificato o non sarà necessario aggiungere i div - Spero che questo abbia senso.

Answer 1

Si dovrebbe usare jquery.validate.js biblioteca per aiutare a risolvere questo problema, controllare il loro demo

Se si utilizza la libreria che sarebbe stato più semplice,

<input type="radio" name="name1" validate="required:true"> 
<input type="radio" name="name1"> 
<input type="radio" name="name1"> 

<input type="radio" name="name2" validate="required:true"> 
<input type="radio" name="name2"> 
<input type="radio" name="name2"> 

Scopri i jFiddle: Questo trova tutti i diversi nomi per i pulsanti di opzione e quindi passa attraverso tutti quei diversi gruppi e si accerta che ce ne sia almeno uno controllato, altrimenti lancia un avviso.

$('#button').click(function() { 
    var names = []; 

    $('input[type="radio"]').each(function() { 
     // Creates an array with the names of all the different checkbox group. 
     names[$(this).attr('name')] = true; 
    }); 

    // Goes through all the names and make sure there's at least one checked. 
    for (name in names) { 
     var radio_buttons = $("input[name='" + name + "']"); 
     if (radio_buttons.filter(':checked').length == 0) { 
      alert('none checked in ' + name); 
     } 
     else { 
      // If you need to use the result you can do so without 
      // another (costly) jQuery selector call: 
      var val = radio_buttons.val(); 
     } 
    } 
}); 

Answer 2

$('[name="name1"]:checked').length != 0 

O

$('[name="name1"]').is(':checked') 

Si potrebbe anche fare qualcosa di un po 'più dinamica se ti piace:

var i = 1; 
while ($('[name="name'+i+'"]').length != 0) { 
    if ($('[name="name'+i+'"]').is(':checked')) { 
     // at least one is checked in this group 
    } else { 
     // none are checked 
    } 
    i++; 
}