Validacja formularza

0

Witajcie,
Mam mały problem z jQuery. Mam taki kod:


<form  class="contact-form contact-form-view">
                        <div class="row">
                            <div class="col-12 pb-4">
                                <label for="name">Imię/Firma*:</label>
                                <input type="text" class="form-control" id="f-name" name="name" required="required">
                            </div>
                            <div class="col-12 col-md-6 pb-4">
                                <label for="email">E-mail*:</label>
                                <input type="email" class="form-control" id="f-email" name="email" required="required">
                            </div>
                            <div class="col-12 col-md-6 pb-4">
                                <label for="phone">Telefon:</label>
                                <input type="text" class="form-control" id="f-phone" name="phone">
                            </div>
                            <div class="col-12">
                                <label for="content">Treść zapytania*:</label>
                                <textarea name="message" cols="40" rows="10" class="form-control" id="f-message"
                                          required="required"></textarea>
                            </div>
                            <div class="form-check form-check-inline">
                                <label class="checkbox">
                                    <input type="checkbox" value="1" name="acceptReg" id="f-checkbox" required/>
                                    <span class="default"></span>
                                </label>
                            </div>
                        </div>
                        <a href="#" class="btn sendContact">Wyślij</a>
                    </form>

Generalnie będę chciał to wysłać za pomocą jQuery. Zrobiłem taki kod:

$('.sendContact').click(function (e) {
        if ($('#f-name').val() == '' || $('#f-email').val() == '' || $('#f-message').val() == '' || $('input[name=acceptReg]').attr('checked') != 1) {
            $('#errorModal').modal('show');
        } else {
            alert('send');
        }
    });

Niestety pomimo wypełnionego formularza, zaznaczonego checkboxa za każdym razem wyświetla mi modela z prośbą o uzupełnienie wszystkich pól :/

Co jest nie tak? :)

0

Debugowałeś z osobna każdy atrybut który tutaj walidujesz? W ciemno mogę strzelić, że ostatni warunek zawsze daje true. Jako że to checkbox to spróbuj sprawdzić jego wartość za pomocą .prop(":checked"). No i polecam dedykowane biblioteki do walidowania, jak już siedzisz w tym jquery to warto to sobie ogarnąć bo chwila roboty a ogarnięte schludnie w miarę czytelnie.

0
masochista napisał(a):

Debugowałeś z osobna każdy atrybut który tutaj walidujesz? W ciemno mogę strzelić, że ostatni warunek zawsze daje true. Jako że to checkbox to spróbuj sprawdzić jego wartość za pomocą .prop(":checked"). No i polecam dedykowane biblioteki do walidowania, jak już siedzisz w tym jquery to warto to sobie ogarnąć bo chwila roboty a ogarnięte schludnie w miarę czytelnie.

console.log($('#f-checkbox').prop(":checked")); - zwraca mi za każdym razem undefined :( Bez względu na to czy jest zaznaczony, czy nie

Rozwiązaniem jest:


$('#f-checkbox').prop("checked") 

1 użytkowników online, w tym zalogowanych: 0, gości: 1