Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [AJAX][JavaScript][PHP] Problem z wielopoziomowym formularzem i warunkami
Forum PHP.pl > Forum > Przedszkole
uire
Witam!

mam problem z php, na wstępie zaznaczę że jestem naprawdę słaby w tym języku, jak i w javascripcie.
Znalazłem fajny skrypt formularza w jqery, który w pola <option> drugiego selecta wpisuje wartości zależne od wybranej opcji pierwszego selecta.
Jednak ja potrzebuję 3 warunków, więc przerobiłem (na tyle na ile potrafię wink.gif ) skrypt tak by wyświetlał pozycje w <option> trzeciego selecta w zależności od wartości <option> w drugim select'cie. I nawet to działało, dopóki nie potrzebowałem przerobić delikatnie skryptu tak, aby wartości trzeciego selecta wyświetlał w zależności od wybranej opcji pierwszego selecta && drugiego selecta.

Problem jest dla mnie bardzo dziwny i nie potrafię sobie wytłumaczyć jak to się dzieje. Jeśli na próbę (w pliku json2.php, odpowiadającym za wyświetlanie opcji w trzecim select'cie) do istniejącego warunku (sprawdzający wartość drugiego selecta) dodam sprawdzanie jeszcze jednego warunku (w JEDNEJ lub KILKU z pozycji) - skrypt działa.

Problem pojawia się, kiedy próbuję dodać do wszystkich instrukcji drugi warunek - wyświetlanie opcji trzeciego selecta całkowicie przestaje działać, nawet z opcją którą dałem na próbę i de facto przed 2 minutami działała.

Proszę o pomoc lub wskazówkę, gdzie tkwi problem. Już kilka dni siedzę nad kodem i nie jestem w stanie nic więcej wymyśleć.

Formularz z jednym warunkiem: http://www.uire.ayz.pl/formularz/test.php
Formularz z dwoma warunkami: http://www.uire.ayz.pl/formularz2/test.php
I formularz z jednym warunkiem podwójnym (na próbę, 1_1 && pozycja1): http://www.uire.ayz.pl/formularz3/test.php

Paczka do pobrania: http://www.uire.ayz.pl/formularz2.zip

Oraz kod plików test.php, json.php, json2.php:


json.php (fragment)
  1. <?php
  2. $json = array();
  3.  
  4. if ($_POST['type'] == '1_1')
  5. {
  6. $json[] = array(
  7. 'value' => 'pozycja1',
  8. 'text' => 'pozycja1'
  9. );
  10. $json[] = array(
  11. 'value' => 'pozycja2',
  12. 'text' => 'pozycja2'
  13. );
  14. $json[] = array(
  15. 'value' => 'pozycja3',
  16. 'text' => 'pozycja3'
  17. );
  18. $json[] = array(
  19. 'value' => 'pozycja4',
  20. 'text' => 'pozycja4'
  21. );
  22. $json[] = array(
  23. 'value' => 'pozycja5',
  24. 'text' => 'pozycja5'
  25. );
  26. }
  27. elseif ($_POST['type'] == '1_2')
  28. {
  29. $json[] = array(
  30. 'value' => 'pozycja4',
  31. 'text' => 'pozycja4'
  32. );
  33. }
  34.  
  35. elseif ($_POST['type'] == '1_3')
  36. {
  37. $json[] = array(
  38. 'value' => 'pozycja4',
  39. 'text' => 'pozycja4'
  40. );
  41. }
  42.  
  43.  
  44.  
  45. echo json_encode($json);
  46. ?>


json2.php (fragent)
  1. <?php
  2. $json2 = array();
  3. //1_1
  4. if ($_POST['type'] == '1_1' && $_POST['types'] == 'pozycja1')
  5. {
  6. $json2[] = array(
  7. 'value' => 'wartosc1',
  8. 'text' => 'wartosc1'
  9. );
  10. }
  11. echo json_encode($json2);
  12. ?>


test.php (fragment)
  1. <script type="text/javascript">
  2. $(document).ready(function(){
  3. $("select#jeden").change(function(){
  4. // Post string
  5. var post_string = "type=" + $(this).val();
  6.  
  7. // Send the request and update sub category dropdown
  8. $.ajax({
  9. type: "POST",
  10. data: post_string,
  11. dataType: "json",
  12. cache: false,
  13. url: 'json.php',
  14. timeout: 2000,
  15. error: function() {
  16. alert("Failed to submit");
  17. },
  18. success: function(data) {
  19. // Clear all options from sub category select
  20. $("select#dwa option").remove();
  21.  
  22. // Fill sub category select
  23. $('#dwa').append('<option value="" selected="selected">--- wybierz ---</option>');
  24. $.each(data, function(i, j){
  25. var row = "<option value=\"" + j.value + "\">" + j.text + "</option>";
  26. $(row).appendTo("select#dwa");
  27. });
  28. }
  29. });
  30. });
  31. $("select#dwa").change(function(){
  32. // Post string
  33. var post_strings = "types=" + $(this).val();
  34.  
  35. // Send the request and update sub category dropdown
  36. $.ajax({
  37. type: "POST",
  38. data: post_strings,
  39. dataType: "json",
  40. cache: false,
  41. url: 'json2.php',
  42. timeout: 2000,
  43. error: function() {
  44. alert("Failed to submit");
  45. },
  46. success: function(data) {
  47. // Clear all options from sub category select
  48. $("select#trzy option").remove();
  49.  
  50. // Fill sub category select
  51. $('#trzy').append('<option value="" selected="selected">--- wybierz ---</option>');
  52. $.each(data, function(i, j){
  53. var row = "<option value=\"" + j.value + "\">" + j.text + "</option>";
  54. $(row).appendTo("select#trzy");
  55. });
  56. }
  57. });
  58.  
  59. });
  60.  
  61. });
  62. </script>
  63. <br />
  64.  
  65. <h3>Wybierz 1 warość:</h3>
  66. <form method="post" action="szukaj.php">
  67. <select name="jeden" id="jeden">
  68. <option value="">--- wybierz ---</option>
  69. <option value="1_1">1_1</option>
  70. <option value="1_2">1_2</option>
  71. <option value="1_3">1_3</option>
  72. <option value="1_4">1_4</option>
  73. <option value="1_5">1_5</option>
  74. <option value="1_6">1_6</option>
  75. <option value="1_7">1_7</option>
  76. <option value="1_8">1_8</option>
  77. <option value="1_9">1_9</option>
  78. <option value="1_10">1_10</option>
  79. <br />
  80.  
  81. <h3>Wybierz drugą wartość: (zależnie od wartości jeden)</h3>
  82. <select name="dwa" id="dwa">
  83. <option value="">--- wybierz ---</option>
  84. <br />
  85.  
  86. <h3>Wybierz trzecią wartość: (zależnie od wartości jeden && dwa)</h3>
  87. <select name="trzy" id="trzy">
  88. <option value="">--- wybierz ---</option>
  89. </select><br />
  90. <input type="submit" name="submit" value="wyślij" />
  91. </form>
b4rt3kk
Jest taki bardzo fajny i na prawdę prosty plugin do jQuery, myślę, że będzie Ci go znacznie łatwiej skonfigurować i zaimplementować:

http://www.appelsiini.net/projects/chained
wNogachSpisz
Tylko i wyłącznie jQuery.wizard
Reszta to syf.
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.