Walidacja checkboxów a HTML5

Wraz z pojawieniem się HTML5 walidacja formularzy stała się znacznie bardziej przyjemniejsza. Przynajmniej walidowanie prostych formularzy można oprzeć w pełni na HTML5. Jednakże, HTML5 ma czasem „problemy” nawet z prostymi rzeczami – np. checkboxami.

Problem występuje, gdy w formularzu musi istnieć możliwość zaznaczenia wielu opcji (np. przy polach do wybrania zainteresowań). Na szczęście możemy to „obejść” prostym skryptem jQuery :)

$('input[name="input_name[]"]').click(function() {
    if($('input[name="input_name[]"]:checked').length) {
        $('input[name="input_name[]"]').removeAttr('required');
    } else {
        $('input[name="input_name[]"]').attr('required', 'required');
     }
});

Podczas kliknięcia na polu przez użytkownika skrypt sprawdza ilość zaznaczonych pól. Jeżeli jest zaznaczone co najmniej jedno pole, zostanie usunięty atrybut required. W przeciwnym wypadku zostanie on dodany :).

Print PDF