JQuery – Validace formuláře

22. 8. 2013 07:08:59

Dobrý den,

rád bych poprosil někoho, kdo se dobře orientuje v jQuery o radu. Řeším aktálně validaci formulářů a narazil jsem na takovou nepříjemnost.

Validaci provádím při kliku na tlačítko submit. Pokud není některé z polí vyplněné přopojím k danému poli třídu .valid-false, která pole označí červeným rámečkem. V případě, že je pole vyplněné ho naopak označím zeleným rámečkem pomocí třídy .valid-ok.

Tohle vše pracuje v pořádku. Bohužel pak nastane problém, pokud uživatel nevyplněná pole opraví a znovu klikne na tlačítko submit, červeně označená pole se již neoznačí zeleným rámečkem. Pravděpodobně zde zůstává původní třída .valid-false

Myslíte, že by šlo nějak udělat, aby se červeně označené pole po kliknutí na submit kontrolovalo ihned jak uživatel napíše alespoň jeden znak do pole které předtím nevyplnil?

Budu moc rád za jakékoli rady nebo pomoc. V jQuery něco napsat dokáži, ale určitě ne už nic tak z mého pohledu náročeného.

Předem moc děkuji

HTML

CSS

22. 8. 2013 07:08:59

0 0

Líbí se: zatím nikdo

Nelíbí se: zatím nikdo

https://webtrh.cz/diskuse/jquery-validace-formulare/#reply936491

Petr Pojer

(9 hodnocení)

22. 8. 2013 07:28:42

Upravil bych začátek na

Coz by melo pred samotnou validaci odstranit tridy s obarvenim ramecku, aby potom nikde nebyly navic.

// EDIT: Upraveny preklepy.

22. 8. 2013 07:28:42

0 0

Líbí se: zatím nikdo

Nelíbí se: zatím nikdo

https://webtrh.cz/diskuse/jquery-validace-formulare/#reply936490

Lukáš Čellár

(6 hodnocení)

22. 8. 2013 07:30:55

Sa zavola vzdy po zadani znaku do nevalidneho inputu.

22. 8. 2013 07:30:55

0 0

Líbí se: zatím nikdo

Nelíbí se: zatím nikdo

https://webtrh.cz/diskuse/jquery-validace-formulare/#reply936489

Ondřej Krobot

(50 hodnocení)

22. 8. 2013 07:37:59

XKojaa: Tohle funguje přesně tak jak jsem potřeboval. Děkuji

cmelo: Tohle je také přesně to co bych potřeboval. Jen nevím jestli jsem to zapsal dobře. Mohl byste na to prosím kouknout?

22. 8. 2013 07:37:59

0 0

Líbí se: zatím nikdo

Nelíbí se: zatím nikdo

https://webtrh.cz/diskuse/jquery-validace-formulare/#reply936488

Lukáš Čellár

(6 hodnocení)

22. 8. 2013 07:40:46

Malo by to fungovat

22. 8. 2013 07:40:46

0 0

Líbí se: zatím nikdo

Nelíbí se: zatím nikdo

https://webtrh.cz/diskuse/jquery-validace-formulare/#reply936487

Ondřej Krobot

(50 hodnocení)

22. 8. 2013 07:42:30

Nějak se tomu právě moc nechce. Zkouším to testovat pomocí alertu, ale nic to při keypress neprovede. Měla by funkce být umítěná v document.ready?

Firebug, rovněž nic nehlásí :-/. zapeklité.

---------- Příspěvek doplněn 22.08.2013 v 07:49 ----------

Pro jistotu přikládám aktuální kód:

$(document).ready( function() {                $( 'form', '#registration-form' ).submit( function (e) {			//DELETE CLASSES			$(this).find('input').removeClass("valid-false").removeClass("valid-ok");									$('.valid-false').keypress(function() {			    alert("ahoj");			    $(this).removeClass("valid-false");			    $(this).addClass( "valid-ok" );			} );                                                //PROM                        var email = $( '#billing_email', '#registration-form' );                        var firstName = $( '#billing_firstName', '#registration-form' );                                              //VALID EMAIL                        if ( !email.val() || !/+@+.{2,}/.test( email.val() ) )                              {                                                               email.addClass( "valid-false" );                                error = true;                        }else{                                                  email.addClass( "valid-ok" );                                   }                                                                       //VALID FIRST AND LAST NAME                        if ( !firstName.val() ) {                                firstName.addClass( "valid-false" );                                error = true;                        }else{                                firstName.addClass( "valid-ok" );                        }                        if(error){                                e.preventDefault();                                return false;                        }                });         });

---------- Příspěvek doplněn 22.08.2013 v 08:09 ----------

Tak už jsem na to asi přišel :-)

Ta funkce keypess musí být mimo .submit funkci, já lojza :-)

Všem moc děkuji za pomoc!!!

22. 8. 2013 07:42:30

0 0

Líbí se: zatím nikdo

Nelíbí se: zatím nikdo

https://webtrh.cz/diskuse/jquery-validace-formulare/#reply936486

Pro odpověď se přihlašte.

Přihlásit