Używam wtyczki walidacji jQuery do walidacji po stronie klienta. Funkcja editUser()
jest wywoływana po kliknięciu przycisku „Edytuj użytkownika”, który wyświetla komunikaty o błędach.
Ale chcę wyczyścić komunikaty o błędach w moim formularzu, kiedy klikam przycisk „Wyczyść”, który wywołuje oddzielną funkcję clearUser()
.
function clearUser() {
// Need to clear previous errors here
}
function editUser(){
var validator = $("#editUserForm").validate({
rules: {
userName: "required"
},
errorElement: "span",
messages: {
userName: errorMessages.E2
}
});
if(validator.form()){
// Form submission code
}
}
jquery
jquery-validate
Vicky
źródło
źródło
resetForm()
nie usuwa wszystkich wystąpień.error
elementów potomnych formularza. To pozostawi resztki CSS, takie jak czerwony kolor tekstu, chyba że zadzwonisz.removeClass()
. Przykład:$('#myform .control-group').removeClass('error');
Sam natknąłem się na ten problem. Miałem potrzebę warunkowego walidacji części formularza, gdy formularz był konstruowany na podstawie kroków (tj. Niektóre dane wejściowe były dynamicznie dołączane podczas działania). W rezultacie czasami lista rozwijana wyboru wymagałaby weryfikacji, a czasami nie. Jednak pod koniec próby musiał zostać zweryfikowany. W rezultacie potrzebowałem solidnej metody, która nie stanowiła obejścia. Sprawdziłem kod źródłowy
jquery.validate
.Oto co wymyśliłem:
Oto jak to wygląda w kodzie:
zminifikowane jako rozszerzenie jQuery:
źródło
showErrors
wykonuje pewne operacje na DOM i jest wywoływany dla każdego elementu w formularzu. Przeglądarka zawieszała się na kilka sekund podczas używania tego kodu w formularzu z ~ 30 kontrolkami. Rozwiązaniem dla mnie byłoshowErrors
wyjście z pętli i wywołanie tego raz tuż przedvalidator.resetForm
. O ile wiem, zachowuje się dokładnie tak samo i jest dużo szybszy.Jeśli chcesz po prostu ukryć błędy:
Jeśli podałeś
errorClass
, wywołaj tę klasę, aby zamiast tego ukryćerror
(domyślnie), której użyłem powyżej.źródło
$(".has-error").removeClass("has-error");
Jeśli wcześniej nie zapisałeś walidatorów oddzielnie podczas dołączania ich do formularza, możesz po prostu wywołać
as
.validate()
zwróci te same walidatory, które dołączyłeś wcześniej (jeśli to zrobiłeś).źródło
Jeśli chcesz to zrobić bez użycia oddzielnej zmiennej, to
źródło
Niestety
validator.resetForm()
w wielu przypadkach NIE działa.Mam przypadek, gdy ktoś kliknie przycisk „Prześlij” w formularzu z pustymi wartościami, powinien zignorować opcję „Prześlij”. Bez błędów. To dość łatwe. Jeśli ktoś wstawi częściowy zestaw wartości i kliknie „Prześlij”, powinien oflagować niektóre pola z błędami. Jeśli jednak wyczyszczą te wartości i ponownie klikną „Prześlij”, powinno to usunąć błędy. W tym przypadku, z jakiegoś powodu, w tablicy „currentElements” w walidatorze nie ma żadnych elementów, więc wykonanie
.resetForm()
absolutnie nic nie robi.Są tam opublikowane błędy.
Do czasu ich naprawienia musisz użyć odpowiedzi Nicka Cravera, NIE zaakceptowanej odpowiedzi Papugi.
źródło
Możesz użyć:
źródło
Myślę, że wystarczy wprowadzić dane wejściowe, aby wszystko wyczyścić
źródło
Jeśli chcesz tylko wyczyścić etykiety walidacyjne, możesz użyć kodu z jquery.validate.js resetForm ()
źródło
Dla tych, którzy używają kodu Bootstrap 3, poniższy wyczyści cały formularz: wiadomości, ikony i kolory ...
źródło
Testowałem z:
Będzie dobrze, gdy będziesz musiał ponownie go zweryfikować.
źródło
Spowoduje to zniszczenie wszystkich błędów walidacji
źródło
W moim przypadku pomogło w podejściu:
źródło
Jeśli chcesz ukryć walidację po stronie klienta, która nie jest częścią przesłanego formularza, możesz użyć następującego kodu:
źródło
Próbowałem każdej odpowiedzi. Jedyne, co mi pomogło, to:
Za pomocą:
źródło
Żadne z innych rozwiązań nie działało dla mnie.
resetForm()
jest jasno udokumentowany, aby zresetować faktyczny formularz, np. usunąć dane z formularza, co nie jest tym, czego chcę. Zdarza się, że czasami tego nie robi, a po prostu usuwa błędy. To, co w końcu zadziałało, to:źródło
Spróbuj użyć tego do usunięcia weryfikacji po kliknięciu anulowania
źródło
Spróbuj użyć:
na przycisku Wyczyść.
źródło
Aby usunąć podsumowanie walidacji, możesz to napisać
$('div#errorMessage').remove();
Jednak po usunięciu ponownie, jeśli weryfikacja się nie powiodła, podsumowanie weryfikacji nie zostanie wyświetlone, ponieważ zostało usunięte. Zamiast tego użyj funkcji ukrywania i wyświetlania, używając poniższego kodu
źródło
Żadne z powyższych rozwiązań nie zadziałało. Byłem rozczarowany, tracąc na nich czas. Jest jednak proste rozwiązanie.
Rozwiązanie to zostało osiągnięte poprzez porównanie znacznika HTML dla prawidłowego stanu i znacznika HTML dla stanu błędu.
Żadne błędy nie spowodowałyby:
gdy wystąpi błąd, ten element div jest zapełniany błędami, a klasa jest zmieniana na validation-summary-errors:
Rozwiązanie jest bardzo proste. Wyczyść kod HTML elementu div, który zawiera błędy, a następnie przywróć klasę do prawidłowego stanu.
Miłego kodowania.
źródło
Jeśli chcesz również zresetować,
numberOfInvalids()
dodaj następujący wierszresetForm
funkcji wjquery.validate.js
linii pliku o numerze: 415.źródło
właśnie zrobiłem
$('.input-validation-error').removeClass('input-validation-error');
aby usunąć czerwoną ramkę z pól błędów wejściowych.
źródło
$(FORM_ID).validate().resetForm();
nadal nie działa zgodnie z oczekiwaniami.Czyszczę formularz z
resetForm()
. Działa we wszystkich przypadkach oprócz jednego !!Kiedy ładuję dowolny formularz przez Ajax i stosuję walidację formularza po załadowaniu mojej dynamiki
HTML
, po tym, jak próbuję zresetować formularz za pomocąresetForm()
i kończy się to niepowodzeniem, a także opróżnia się wszystkie walidacje, które stosuję na elementach formularza.Więc uprzejmie nie używaj tego dla formularzy ładowanych przez Ajax LUB ręcznie zainicjowanej walidacji.
PS Musisz użyć odpowiedzi Nicka Cravera dla takiego scenariusza, jak wyjaśniłem.
źródło
validator.resetForm()
Wyczyść tekst błędu. Ale jeśli chcesz usunąć CZERWONĄ ramkę z pól, musisz usunąć klasęhas-error
źródło
Funkcja wykorzystująca podejście Travisa J , JLewkovicha i Nicka Cravera ...
źródło
Napisz własny kod, ponieważ każdy używa innej nazwy klasy. Resetuję walidację jQuery za pomocą tego kodu.
źródło