Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [PHP][HTML][JavaScript]Wyskakujący komunikat
Forum PHP.pl > Forum > Przedszkole
Szunaj85
Poniższy skrypt przedstawia taką sytuację, że kiedy użytkownik nie zaznaczy żadnej odpowiedzi wyskakuje komunikat.
  1. function spr()
  2. {
  3. if(document.getElementById('glos1').checked || document.getElementById('glos2').checked){
  4. return true;
  5. }
  6. else {
  7. alert('Wybierz odpowiedź,');
  8. return false;
  9. }
  10. }
  11. <form action="" method="post" onsubmit="return spr();">
  12. <input type="radio" name="glos" id="glos1" value="1" />Tak<br />
  13. <input type="radio" name="glos" id="glos2" value="2" />Nie<br />
  14. <input type="submit" value="Zagłosuj" />
  15. </form>

Ja jednak mam taką sytuację jak poniżej. Owszem chcę żeby komunikat wyskakiwał tak jak wyżej, ale gdy użytkownik nie zaznaczy jednej z trzech odpowiedzi w każdej grupie odpowiedzi.
  1. <b>Pytanie 1</b>
  2. <tr>
  3. <td><input type="radio" name="1" value="a">Odpowiedź<br /></td>
  4. </tr>
  5. <tr>
  6. <td><input type="radio" name="1" value="b">Odpowiedź<br /></td>
  7. </tr>
  8. <tr>
  9. <td><input type="radio" name="1" value="c">Odpowiedź<br /></td>
  10. </tr>
  11. <b>Pytanie 2</b>
  12. <tr>
  13. <td><input type="radio" name="2" value="a">Odpowiedź<br /></td>
  14. </tr>
  15. <tr>
  16. <td><input type="radio" name="2" value="b">Odpowiedź<br /></td>
  17. </tr>
  18. <tr>
  19. <td><input type="radio" name="2" value="c">Odpowiedź<br /></td>
  20. </tr>
  21. <input type="submit" value="Odpowiedz" />

A jeszcze lepiej gdyby można to za pomocą PHP zrobić.
nexis
  1. <?php
  2. if (!isset($_POST['1'], $_POST['2'])) { ?>
  3. <script type="text/javascript">
  4.    alert("Wypelnij wszystkie pola!");
  5.    history.back();
  6. </script>
  7. <?php } else {
  8.    // Przetwarzanie danych
  9. }
  10. ?>
Szunaj85
Próbowałem na różne sposoby, ale ten skrypt chyba nie działa. sadsmiley02.gif
Nie musi być na siłę PHP. Jeśli to możliwe wystarczy javascript.
Mam nadzieję, że dobrze wytłumaczyłem. Ale na wszelki wypadek powiem, że chcę zadać x pytań, a każde pytanie ma 3 odpowiedzi. Tylko jedna jest poprawna i tylko jedną odpowiedź w każdym pytaniu można zaznaczyć. Jak w jednym lub więcej pytaniach nie będzie zaznaczona żadna odpowiedź, a użytkownik naciśnie "odpowiedz" wtedy wyskakuje komunikat (alert). Oczywiście jeśli wszystkie odpowiedzi są zaznaczone nie musi nic wyskakiwać.
nexis
Działa tylko widocznie nie potrafisz go dobrze złożyć. Tutaj wszystko w jednym pliku:

  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
  2. <html>
  3.   <head>
  4.      <meta http-equiv="content-type" content="text/html; charset=utf-8">
  5.      <title>Szunaj85</title>
  6.   </head>
  7.   <body>
  8.      <?php
  9.      if (0 < count($_POST)) { // formularz został wysłany
  10.         if (!isset($_POST['1'], $_POST['2'], $_POST['3'])) { // formularz nie został prawidłowo wypełniony
  11.            ?>
  12.            <script type="text/javascript">
  13.               alert("Wypełnij wszystkie pola!");
  14.               history.back();
  15.            </script>
  16.            <?php
  17.         } else {
  18.            echo 'Formularz został prawidłowo wypełniony!<br />' . PHP_EOL;
  19.            foreach($_POST as $key => $value) {
  20.               printf('Pytanie %d: %s<br />' . PHP_EOL, $key, $value);
  21.            }
  22.         }
  23.      } else { // wyświetlamy formularz
  24.      ?>
  25.      <form action="<?=$_SERVER['PHP_SELF']?>" method="post">
  26.         <ol>
  27.            <li>Pytanie
  28.               <ul>
  29.                  <li><input type="radio" name="1" value="a" />a</li>
  30.                  <li><input type="radio" name="1" value="b" />b</li>
  31.                  <li><input type="radio" name="1" value="c" />c</li>
  32.               </ul>
  33.            </li>
  34.            <li>Pytanie
  35.               <ul>
  36.                  <li><input type="radio" name="2" value="a" />a</li>
  37.                  <li><input type="radio" name="2" value="b" />b</li>
  38.                  <li><input type="radio" name="2" value="c" />c</li>
  39.               </ul>
  40.            </li><li>Pytanie
  41.               <ul>
  42.                  <li><input type="radio" name="3" value="a" />a</li>
  43.                  <li><input type="radio" name="3" value="b" />b</li>
  44.                  <li><input type="radio" name="3" value="c" />c</li>
  45.               </ul>
  46.            </li>
  47.         </ol>
  48.         <input type="submit" />
  49.      </form>
  50.      <?php } ?>
  51.   </body>
  52. </html>
Szunaj85
Ok widzę, że faktycznie działa. Ale jest jedna rzecz.
Wszystkie zaznaczone odpowiedzi znikają po wyskoczeniu komunikatu i trzeba uzupełniać wszystko od nowa.
Wolałbym takiej sytuacji uniknąć ponieważ ten komunikat ma informować o nie uzupełnionym pytaniu, a nie kasować. tongue.gif
No i jest pewien problem (coś kosztem czegoś) twój skrypt zaczął działać za to mój przestał.
Może dało by radę wykonać to w samym javascript?
Gość
Tak sobie myślę, że możesz zrobić to tak.
Każde pytanie miało by jedno ID, czyli 3 odpowiedzi w każdym pytaniu miały by takie same ID.
A później skrypt sprawdzałby czy w każdym pytaniu jest zaznaczona chociaż jedna odpowiedź. I gdy w jakimś pytaniu nie jest zaznaczona odpowiedź wyświetlałby komunikat.
Jednak to tylko teoria. Nie znam javascript więc tylko tyle mogę pomóc.
sowiq
Mój sposób jest o tyle dobry, że nie ma znaczenia ile masz pytań i po ile do nich odpowiedzi. Jest całkowicie elastyczny, ale pod warunkiem, że HTML będzie miał taką strukturę smile.gif W innym wypadku potrzebna będzie niewielka modyfikacja.

HTML:
  1. <form id="myForm" onsubmit="return checkForm();" ...>
  2. <ul>
  3. <li><input ...></li>
  4. <li><input ...></li>
  5. <li><input ...></li>
  6. </ul>
  7. <ul>
  8. <li><input ...></li>
  9. <li><input ...></li>
  10. <li><input ...></li>
  11. </ul>
  12. </form>



JS:
Kod
function checkForm(){
    var uls = document.getElementById('myForm').getElementsByTagName('ul');
    var inputs;
    var checked;
    
    for(var i = 0; i < uls.length; ++ i){
        inputs = uls[i].getElementsByTagName('input');
        
        checked = false;
        for(var n = 0; n < inputs.length; ++ n){
            if(inputs[n].checked){
                checked = true;
                break;
            }
        }
        if(!checked){
            alert('Wypełnij wszystkie pola!');
            return false;
        }
    }
    return true;
}


ps. mogą być literóki - pisane z palca
Szunaj85
U mnie struktura HTML wygląda tak:
  1. <form id="myForm" onsubmit="return checkForm();" action="druga_strona.php" method="post">
  2. <td align="left"><b>Pytanie 1</b></td>
  3. <ul>
  4. <tr>
  5. <td align="left"><input type="radio" name="1" value="a" />Odpowiedź<br /></td>
  6. </tr>
  7. <tr>
  8. <td align="left"><input type="radio" name="1" value="b" />Odpowiedź<br /></td>
  9. </tr>
  10. <tr>
  11. <td align="left"><input type="radio" name="1" value="c" />Odpowiedź<br /></td>
  12. </tr>
  13. </ul>
  14. ...
  15. <div align="center">
  16. <input type="submit" name="submit" value="Sprawdź odpowiedzi" /> </div>
  17. </form>

Mam nadzieję, że <ul> wpisałem w dobrym miejscu.
A co do skryptu wygląda na to, ze w pewnym stopniu działa. Tylko, że gdy nawet zaznaczę wszystkie odpowiedzi wyskakuje komunikat nie pozwalając przejść do wyników na następnej stronie. sadsmiley02.gif
sowiq
1) nie rób lay'a na tabelkach.
2) jeśli koniecznie chcesz tabelki - naucz się je robić, bo teraz masz kaszę z tagów, a nie tabelkę
3) mój przykład nie przyda Ci się w tego rodzaju layout'cie, bo nie ma jednego elementu nadrzędnego dla każdej z grup input'ów - równie dobrze możesz sprawdzać po kolei ręcznie wszystkie pola.

Napisałem Ci kod - wykorzystaj go.
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.