Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: Formularz wieloetapowy/krokowy
Forum PHP.pl > Forum > PHP
jurcio6
15.01.2011, 12:55:06
Witam,

Mam problem - potrzebuję sklecić na moją stronę formularz dodawania ankiet. Wymyśliłem sobie, że będzie on miał kilka etapów - kolejnych kroków:
Krok 1. Wpisanie tytułu ankiety, opisu, ilości pytań itp.
Krok 2. Wpisanie treści pytań i określenie ilości odpowiedzi dla każdego z nich.
Krok 3. Wpisanie odpowiedzi dla każdego z pytań.
Krok 4. Podsumowanie (wyświetlenie całej ankiety).
Krok 5. Zapis do bazy i zakończenie.

Wiem jak to wszystko sklecić, natomiast problem mam następujący: jak najlepiej przekazywać dane do kolejnych formularzy? Jaśniej: uzupełniam w pierwszym kroku tytuł, opis, ilość pytań i teraz po przejściu do drugiego kroku muszę wykorzystać te przesłane z 1 kroku dane (np. ilość pytań aby móc wyświetlić odpowiednią ilość boxów do wpisania pytań) - z tym nie ma problemu, wiadomo $_POST['***'] i te zmienne są dostępne. Problem natomiast jest taki, że chcę, aby te dane przesłane zostały znów dalej do kolejnych kroków (w tym wypadku dane z kroku 1 i dane z kroku 2 mają być dostępne w kroku 3 itd aż do końca formularza, gdzie mają zostać zapisane transakcją do BD). Jak to zrobić? Wykorzystanie pól hidden chyba nie ma zbytnio sensu, ponieważ liczba przesyłanych pól formularza może być bardzo różna, a wszystko ma być generowane dynamicznie...

Dodatkowo chciałbym jeszcze dodać możliwość 'dowolnego skakania po krokach', czyli np. z kroku 3 mogę cofnąć się do kroku 2, a wtedy skrypt w pola formularza kroku 2 wczytuje te dane, które wcześniej wpisałem i daje możliwość ich edycji. Kolejny problem, jaki mi przychodzi do głowy, to sytuacja kiedy: wpisuje dane w kroku 3, wciskam "wstecz", aby cofnąć się do kroku 2 i.. dane z kroku 3. szlag trafia, bo nie wdusiłem "dalej", tylko wstecz..

Proszę o pomoc - jako to ugryźć?

PS. Dodam, iż korzystam z logowania i sesji, ale nie bardzo mam pomysł, jak mógłbym to wykorzystać. A może lepiej zapis do tymczasowej tabeli po każdym kroku?
tehaha
15.01.2011, 13:10:35
zapisuj odpowiedzi w sesji
celbarowicz
15.01.2011, 13:18:35
jak wyżej czyli:
session_start();
$_SESSION['dana_x']=$_POST['dana_x']

i $_SESSION['dana_x'] dostępne jest we wszystkich plikach (oczywiście session_start()winksmiley.jpg

ponadto w formularzu


if(!isset($_SESSION['dana_x'])){$_SESSION['dana_x'] ="";}


<input type="text" value="<?php echo $_SESSION['dana_x']; ?>" >
posiadacz
15.01.2011, 19:25:23
Witam,
jestem odmiennego zdania.

Stworzyłbym jeden element form zawierający kilka sekcji pokazywanych/ukrywanych javascriptem.
Dodatkowo aby działały klawisze dalej i wstecz w przeglądarce do każdego kroku dodawałbym #numer_kroku.
Kshyhoo
15.01.2011, 19:44:06
Jestem podobnego zdania, zrobiłbym coś takiego:
[PHP] pobierz, plaintext 
  1. switch (strip_tags($_GET['go'])) {
  2. 	default:
  3. 		 echo '<form name="generator" action="?go=1" method="POST">
  4. 			<input type="hidden" name="krok" value="1">  
  5. 			<input type="submit" name="dalej" value="Idź dalej"></form>';
  6. 	break;
  7. //////////////////////////////////// KROK 1 ////////////////////////////////////
  8. 	case '1':
  9. 		echo 'Krok 1';
  10. 		echo '<form name="generator" action="?go=2" method="POST">';
  11. 		// tu inkludowany plik krok1.php
  12. 		echo '<input type="hidden" name="krok" value="2">  
  13. 			<input type="submit" name="dalej" value="Idź dalej"></form>';
  14. 		break;
  15. //////////////////////////////////// KROK 2 ////////////////////////////////////
  16. 	case '2':
  17. 		echo 'Krok 2';
  18. 		echo '<form name="generator" action="?go=3" method="POST">';
  19. 		// tu inkludowany plik krok2.php
  20. 		echo '<input type="hidden" name="krok" value="3">  
  21. 			<input type="submit" name="dalej" value="Idź dalej"></form>';
  22. 	break;
  23. }
[PHP] pobierz, plaintext

No i sesje...
celbarowicz
15.01.2011, 20:41:34
dlaczego GET a nie POST
posiadacz
15.01.2011, 21:29:34
Chyba ktoś nie doczytał... winksmiley.jpg miałem na myśli elementy formularza pokazywane z poziomu javascriptu.
Czyli:
[HTML] pobierz, plaintext 
  1. <form>
  2. <div id="step1">
  3. <input />
  4. </div>
  5. <div id="step2">
  6. <input />
  7. </div>
  8. </form>
  9.  
  10. <script>
  11. $('#step1').show();
  12. $('#step2').hide();
  13. </script>
[HTML] pobierz, plaintext

Ubrać to ładnie w funkcje i jazda.
Zerknij np tu:
http://www.domoklik.pl/pl/dodaj-oferte


Cytat(Kshyhoo @ 15.01.2011, 20:44:06 ) *
Jestem podobnego zdania, zrobiłbym coś takiego:
[PHP] pobierz, plaintext 
  1. switch (strip_tags($_GET['go'])) {
  2. 	default:
  3. 		 echo '<form name="generator" action="?go=1" method="POST">
  4. 			<input type="hidden" name="krok" value="1">  
  5. 			<input type="submit" name="dalej" value="Idź dalej"></form>';
  6. 	break;
  7. //////////////////////////////////// KROK 1 ////////////////////////////////////
  8. 	case '1':
  9. 		echo 'Krok 1';
  10. 		echo '<form name="generator" action="?go=2" method="POST">';
  11. 		// tu inkludowany plik krok1.php
  12. 		echo '<input type="hidden" name="krok" value="2">  
  13. 			<input type="submit" name="dalej" value="Idź dalej"></form>';
  14. 		break;
  15. //////////////////////////////////// KROK 2 ////////////////////////////////////
  16. 	case '2':
  17. 		echo 'Krok 2';
  18. 		echo '<form name="generator" action="?go=3" method="POST">';
  19. 		// tu inkludowany plik krok2.php
  20. 		echo '<input type="hidden" name="krok" value="3">  
  21. 			<input type="submit" name="dalej" value="Idź dalej"></form>';
  22. 	break;
  23. }
[PHP] pobierz, plaintext

No i sesje...

Kshyhoo
15.01.2011, 21:46:17
Cytat(celbarowicz @ 15.01.2011, 20:41:34 ) *
dlaczego GET a nie POST

Wysyłasz POSTem, odbierasz GETem...
jurcio6
16.01.2011, 09:25:52
Zapisywanie tego wszystkiego w sesji to trochę jak z motyką na słońce... a niech ktoś zrobi sobie ankietę z 20 pytaniami i do każdego pytania doda 4 odpowiedzi - w sumie do zapisania ponad 100 pól - moim zdaniem niezbyt sprytnie by to działało..

Myślałem właśnie bardziej o jednym pliku na switchu, coś jak podsunął mi Kshyhoo. Z tym że tam i tak bym musiał chyba zapisywać dane z case'a 1 do sesji przed przejściem do kolejnych kroków?

Posiadacz, czy mógłbyś mi trochę przybliżyć ten Twój sposób. A co jeśli ktoś używa przeglądarki z wyłączoną Javą? No i kluczowa kwestia: jak mam udostępnić wartości z formularza z kroku 1 w formularzu z kroku 2 poprzez samo ukrywanie/pokazywanie warstw? Mało tego, jak mam z tych wartości wygenerować coś (np. odpowiednią liczbę pól w formularzu)? Nie ma przecież możliwości, żeby dopiero teraz przesłać te wartości z Javy do PHP i żeby dopiero wtedy wygenerować odpowiednią ilość pól, bo strona nie wczytuje się na nowo.. W związku z tym musiałbym te wartości chyba jakoś odczytywać Javą z pól.. nie wiem, nie mam pomysłu. W moim wypadku miałoby to wyglądać tak: wpisuje w pierwszym kroku ilość pytań w ankiecie, a w drugim kroku ma mi się pojawić tyle boxów, ile zadeklarowałem pytań w kroku1. Czy dałoby się to zrobić? Jak mniej więcej..

Ogólnie wolałbym tego wszystkiego uniknąć - nie znam JS smile.gif Jestem w stanie to i owo przekminić, wiadomo, ale nie do tego stopnia, żeby pisać w nim całe skrypty. No ale wydaje się to być najsprytniejszym rozwiązaniem (poza przypadkiem, że admin/ankieter może nie mieć JS i wtedy jest lipa po całości.. ale to tylko praca mgr, więc nie popadajmy w skrajności - ma po prostu działać tongue.gif

EDIT: Znalazłem odpowiedź na część pytań pisząc po prostu taki skrypt, dlatego część posta wykasowałem/zmieniłem. Pozostają jeszcze inne pytania (powyżej).
posiadacz
16.01.2011, 10:36:52
Bez znajomości JS będzie ciężko... sad.gif
Elementami DOM można zarządzać z poziomu JS niezależnie od tego czy są widoczne czy ukryte.
W momencie uzupełniania pól w formularzu nr 1 uzupełniaj odpowiednie inputy, divy w formie nr 2. Możesz też odczytać je przy pokazywaniu kroku nr 2 - to zależy już od ciebie.
Kwestia JSa - mało osób go niema. Jeśli chcesz żeby działało też u nich musisz zrobić tak jak pisali inni, na sesji, ale też trzeba zrobić to z głową. Dobrze obsłużyć sytuację gdy user opuści formularz w połowie i wróci później np.
jurcio6
16.01.2011, 11:06:59
Zostanę więc przy JS - myślę, że jakoś dam radę (z dużą "odrobiną" pomocy smile.gif ).

Na razie próbowałem coś takiego i działa w porządku:

[HTML] pobierz, plaintext 
  1. <html>
  2. <head>
  3.  
  4. <script type="text/javascript" language="JAVASCRIPT">
  5.   function showhide(id1, id2) {
  6. 	document.getElementById(id1).style.display='none';
  7. 	document.getElementById(id2).style.display='block';
  8.  }
  9. </script>
  10.  
  11. </head>
  12. <body>
  13. <div style="display: block" id="ukryty1">
  14. 	<hr />
  15. 	<p>Oto treść diva 1.</p>
  16. 	<form id="formularz1" name="formularz1" action="ankieta.php" method="POST">
  17. 		pole 1: <input id="pole1" name="pole1" />
  18. 		pole 2: <input id="pole2" name="pole2" />
  19. 		<br />
  20. 		<a href="java script: showhide('ukryty1', 'ukryty2');">dalej</a>
  21. 	<hr>
  22. </div>
  23.  
  24. <div style="display: none" id="ukryty2">
  25. 	<hr />
  26. 	<p>Oto treść diva 2.</p>
  27. 		pole 3: <input id="pole3" name="pole3" />
  28. 		pole 4: <input id="pole4" name="pole4" />
  29. 		<br />
  30. 		<a href="java script: showhide('ukryty2', 'ukryty1');">wstecz</a>
  31.  
  32. 		<input type="submit" id="send" name="send" />
  33.  
  34. 	</form>
  35. 	<hr>
  36. </div>
  37.  
  38. </body>
  39. </html>
[HTML] pobierz, plaintext 


[PHP] pobierz, plaintext 
  1. <?php
  2.  
  3. if(isset($_POST['send']))
  4. {
  5. 	echo $_POST['pole1'].'<br />';
  6. 	echo $_POST['pole2'].'<br />';
  7. 	echo $_POST['pole3'].'<br />';
  8. 	echo $_POST['pole4'].'<br />';
  9. }
  10. else
  11. 	echo "Nie wypełniono formularza!";
  12.  
  13. ?>
[PHP] pobierz, plaintext


Problem pozostaje właśnie z tym, że: wysyłam w formularzu w kroku1 jakąś wartość (np. liczba pytań: N), a przez to w kroku2 generuje N boxów <input type="text">. No i z tych opcji, które podałeś, to myślę, że najlepiej byłoby odczytywać te wartości pól w momencie przejścia do kolejnego kroku - w trakcie wypełniania nie jest to potrzebne. Miałem też gdzieś taki prosty skrypcik js do sprawdzania, czy wszystkie pola zostały wypełnione, ale to już dorzucę na samym końcu.
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.