Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [JavaScript]Podświetlanie pustego pola formularza.
Forum PHP.pl > Forum > Przedszkole
ublizzard
Chciałbym, aby pole formularza podświetlało się, gdy jest puste, zrobiłem to za pomocą js i css, kod wygląda tak:
  1. <form action="rejestracja.php" name="wpis" method="POST">
  2. <table>
  3. <tr><td>Tytuł strony:* </td><td><input type=text name="adres" size="53" onfocus="onf_class(this);" onblur="onb_class(this);" class="blur"></td></tr>
  4. <tr><td></td><td><input onclick="return validateWpis(this)" type="submit" value="Wyślij"></td></tr>
  5. </table>

  1. function validateWpis(){
  2. if (document.forms['wpis'].adres.value==''){
  3. alert ('Podaj adres strony');
  4. document.forms['wpis'].focus();
  5. return false;
  6. }else{
  7. return true}
  8. }

  1. .focus {
  2. border: 1px red solid;
  3. background-color: red;
  4. }
  5. .blur {
  6. border: 1px #000 solid;
  7. }

Niestety to nie jest dokońca to o co mi chodziło, bo pole podświetla się za każdym razem jak się w nim znajdzie kursor, a ja bym chciał, żeby podświetlało się tylko wtedy, gdy funkcja validateWpis zwróci false, czy ktoś ma pomysł jak to zrobić?
CuteOne
Walidacje przeprowadzasz po kliknięciu w submit.

google -> form onsubmit
ublizzard
Cytat(CuteOne @ 9.01.2012, 10:08:14 ) *
Walidacje przeprowadzasz po kliknięciu w submit.

Czyli z tego co rozumiem, to nie ma takiej możliwości, ewentualnie trzeba by wczytać jeszcze raz stronę z np zmienną, która mówiłaby które pole ma być podświetlone, no i trzeba by zrezygnować z z
  1. onfocus="onf_class(this);" onblur="onb_class(this);" class="blur"
  2.  
  3. function onf_class(elm) {
  4. elm.className='focus';
  5. }
  6. function onb_class(elm) {
  7. elm.className='blur';
  8. }

Dobrze zrozumiałem?
crafter
nie bardzo zrozumiałeś
robisz to na zdarzenie albo onSubmit albo onblur w zlaeznosci kiedy chcesz zeby sie wykonalo.
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.