jQuery
Casella di controllo Seleziona tutto con controllo / deselezione automatico su altra modifica della casella di controllo
Ricerca…
introduzione
Ho usato vari esempi StackOverflow e le risposte per venire a questo esempio molto semplice su come gestire la casella di controllo "seleziona tutto" accoppiato con un controllo automatico / deselezionare se uno qualsiasi degli stati della casella di controllo del gruppo cambia. Vincolo: l'ID "Seleziona tutto" deve corrispondere ai nomi di input per creare il gruppo Seleziona tutto. Nell'esempio, l'input seleziona tutto l'ID è cbGroup1. I nomi di input sono anche cbGroup1
Il codice è molto breve, non un sacco di istruzioni if (tempo e risorse che consumano).
2 selezionare tutte le caselle di controllo con caselle di controllo gruppo corrispondenti
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<p>
<input id="cbGroup1" type="checkbox">Select all
<input name="cbGroup1" type="checkbox" value="value1_1">Group1 value 1
<input name="cbGroup1" type="checkbox" value="value1_2">Group1 value 2
<input name="cbGroup1" type="checkbox" value="value1_3">Group1 value 3
</p>
<p>
<input id="cbGroup2" type="checkbox">Select all
<input name="cbGroup2" type="checkbox" value="value2_1">Group2 value 1
<input name="cbGroup2" type="checkbox" value="value2_2">Group2 value 2
<input name="cbGroup2" type="checkbox" value="value2_3">Group2 value 3
</p>
<script type="text/javascript" language="javascript">
$("input").change(function() {
$('input[name=\''+this.id+'\']').not(this).prop('checked', this.checked);
$('#'+this.name).prop('checked', $('input[name=\''+this.name+'\']').length === $('input[name=\''+this.name+'\']').filter(':checked').length);
});
</script>
Modified text is an extract of the original Stack Overflow Documentation
Autorizzato sotto CC BY-SA 3.0
Non affiliato con Stack Overflow