Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [PHP]podmenu w ajaxie
Forum PHP.pl > Forum > Przedszkole
wpaski
19.10.2012, 22:56:13
Jak mam rozwiązać dany problem, jest plik index.php i pokojegoscinne.php (dodatkowo jeszcze apartamenty.php ale on jest pusty, tylko w kodzie zawarty by były 2 linki)
A więc jest taka struktura:
Menu - 1 - linki:

-Pokoje goscinne
-Apartamenty

Po kliknieciu w Pokoje goscinne otwiera sie kolejne menu i w nim linki:
Menu - 2 - Podmenu:

-Anna
-Milena

Są to linki po których kliknięciu oczekuję wyświetlenie konkretnych danych w ajaxie a mianowicie tych z pętli switch:
[PHP] pobierz, plaintext 
  1.  switch($_GET['pokojgoscinny'])
  2.     {
  3.      case 'anna':
  4.          echo 'Anna';
  5.          break;
  6.      case 'milena':
  7.          echo 'Milena';
  8.          break;
  9.     }
[PHP] pobierz, plaintext


Cały kod, najlepiej gdyby to ktoś przetestował bo tak to ciężko to opisać, póki co działa to tak że pobiera całą stronę zamiast tylko tych "ech" czyli zamiast echo 'Anna' wszystko jest wyświetlane.

index.php
[PHP] pobierz, plaintext 
  1. <!DOCTYPE html 
  2. 	PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  3. 	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  4. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pl" lang="pl">
  5. <head>
  6. 	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  7. 	<meta name="Description" content="Tu wpisz opis zawartości strony" />
  8. 	<meta name="Keywords" content="Tu wpisz wyrazy kluczowe rozdzielone przecinkami" />
  9. 	<title>title</title>
  10.  
  11.         <script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
  12.  
  13.         <script type="text/javascript" language="JavaScript">
  14.  
  15.                 $(document).ready(function(){
  16.  
  17.                         $('#podmenu a').click(function() { 
  18.  
  19.                                 var content_show = $(this).attr("title");
  20.                                // console.log(content_show);
  21.  
  22.                                         $.ajax({
  23.                                                 method: "get",url: "index.php?strona=pokojegoscinne",
  24.                                                 data:"pokojgoscinny="+content_show,
  25.  
  26.                                                 success: function(html){ 
  27.                                                 $(".content").html(html); 
  28.                                                 }
  29.                                         }); 
  30.                                           return false;
  31.                         }); 
  32.  
  33.                 }); 
  34.  
  35.         </script>
  36.  
  37.         <style>
  38.             body {
  39.                 margin: 0 auto;
  40.                 width: 1100px;
  41.             }
  42.             #menu {
  43.                 float: left;
  44.                 width: 300px;
  45.             }
  46.             #middle {
  47.                 width: 800px;
  48.                 float: right;
  49.             }
  50.         </style>
  51. </head>
  52. <body>
  53.  
  54.     <div id="menu">
  55.         <a href="index.php?strona=pokojegoscinne">Pokoje goscinne</a><br />
  56.         <a href="index.php?strona=apartamenty">Apartamenty</a>
  57.     </div>
  58.     <div id="middle">
  59. <?php
  60.       // $url = isset($_GET['strona']) ? $_GET['strona'] : '';
  61.  
  62.       if(isset($_GET['strona'])) {
  63.       $file = $_GET['strona'] . '.php';
  64. 		if (file_exists($file)) {
  65. 			require $file;
  66. 		} else {
  67. 			echo 'error';
  68. 		}
  69.        }
  70.        else {
  71.            echo 'default';
  72.        }
  73.  
  74. ?>
  75.     </div>
  76.  
  77. </body>
  78. </html>
[PHP] pobierz, plaintext

pokojegoscinne.php
[PHP] pobierz, plaintext 
  1. <?php
  2.  
  3. /*
  4.  * index.php?strona=pokojegoscinne&pokojgoscinny=anna
  5.  * index.php?strona=pokojegoscinne&pokojgoscinny=milena
  6.  * *
  7.  */
  8. ?>
  9. <ul id="podmenu">
  10.  <a href="" title="anna">Anna</a><br />
  11.  <a href="" title="milena">Milena</a>
  12. </ul>
  13.  <?php
  14.  /*
  15.  if(isset($_GET['strona']) AND isset($_GET['pokojgoscinny'])) {
  16.      if($_GET['pokojgoscinny'] == 'anna') {
  17.          echo 'anna';
  18.      }
  19.      elseif($_GET['pokojgoscinny'] == 'milena') {
  20.          echo 'milena';
  21.      }
  22.  }
  23.  */
  24.  switch($_GET['pokojgoscinny'])
  25.     {
  26.      case 'anna':
  27.          echo 'Anna';
  28.          break;
  29.      case 'milena':
  30.          echo 'Milena';
  31.          break;
  32.     }
  33.  
  34.  
  35.  ?>
  36.  
  37. <div class="content">
  38.  
  39.  
  40. </div>
[PHP] pobierz, plaintext


Komentarzy nie usuwałem, może sie na coś przydają.
jaslanin
20.10.2012, 06:59:27
zdecydowanie tak się tego nie robi, zobacz jak to inni robią:

http://www.1stwebdesigner.com/css/38-jquer...menu-solutions/

Cytat
Cały kod, najlepiej gdyby to ktoś przetestował bo tak to ciężko to opisać, póki co działa to tak że pobiera całą stronę zamiast tylko tych "ech" czyli zamiast echo 'Anna' wszystko jest wyświetlane.


Jest to normalne zachowanie, w pliku pokojegoscinne.php przekazujesz dane i jquery wszystko przekazuje dalej to Twoje zadanie by przekazywać właściwe dane. Jeżeli chcesz by tylko echa były zwracane usuń resztę kodu, albo zrób instrukcję warunkową tak by w przypadku A wyświetlało resztę kodu a w przypadku B tylko kod zwracany przez switch.

Ewentualnie możesz użyć: http://api.jquery.com/load/#loading-page-fragments

[PHP] pobierz, plaintext 
  1. <ul id="podmenu">
  2.  <a href="" title="anna">Anna</a><br />
  3.  <a href="" title="milena">Milena</a>
  4. </ul>
[PHP] pobierz, plaintext


to nie jest poprawny kod: http://www.w3schools.com/tags/tag_ul.asp

[PHP] pobierz, plaintext 
  1. if(isset($_GET['strona'])) {
  2.       $file = $_GET['strona'] . '.php';
  3. 		if (file_exists($file)) {
  4. 			require $file;
  5. 		} else {
  6. 			echo 'error';
  7. 		}
  8.        }
  9.        else {
  10.            echo 'default';
  11.        }
[PHP] pobierz, plaintext


Nie wolno tak robić, taki kod jest podatny na ataki hakerskie typu Local File Inclusion, musisz się upewniać że ładujesz tylko i wyłącznie właściwe pliki. Ktoś może podmienić zmienną $_GET['strona'] tak by by załadować plik którego nie chciał byś załadować.
wpaski
20.10.2012, 10:17:16
dzięki za odpowiedź, nie zabezpieczałem tego kodu bo skupiałem się tylko na tym problemie ale wiem - powinienem to zrobić gdy coś tu umieszczam, co do linku który podałeś to z tego co widzę wszystko jest w samym ajaxie(przynajmniej ja nie widzę ale może źle patrzę żeby było coś podobnego do tego co tutaj), nie ma tam takiego czegos jak tu w sensie, że pierwsze menu ma być ładowane przez include a dopiero drugie przez ajax. Jeśli chodzi o
Cytat
zrób instrukcję warunkową tak by w przypadku A wyświetlało resztę kodu a w przypadku B tylko kod zwracany przez switch.

to nie wiem jak to ugryźć, bo parametr strona=pokojegoscinne zawsze będzie w linku takze jeśli sprawdze:
[PHP] pobierz, plaintext 
  1. if(isset($_GET['strona']) AND !isset($_GET['pokojgoscinny'])) {
  2. // tutaj wyswietle 1 menu a w else drugie
[PHP] pobierz, plaintext


to nic nie da bo $_GET['strona'] będzie zawsze istniał


drugie rozwiązanie z tym wycinkiem wydaje mi się lepsze, tylko nie wiem jak to zrobić, próbowałem tak:
Kod
$(".content").html(html).find(".imie");

a w pliku pokojegoscinne.php
[PHP] pobierz, plaintext 
  1. switch($_GET['pokojgoscinny'])
  2.     {
  3.      case 'anna':
  4.      ?>
  5. <div class="imie">
  6.     <?php
  7.          echo 'Anna';
  8.      ?>
  9. </div>
  10.     <?php
  11.          break;
  12.      case 'milena':
  13.     ?>
  14. <div class="imie">
  15.     <?php
  16.          echo 'Milena';
  17.     ?>
  18. </div>
  19.     <?php
  20.          break;
  21.  
  22.     }
[PHP] pobierz, plaintext


jednak nie działa
jaslanin
26.10.2012, 17:48:36
1. ajax to nie to samo co JavaScript
2.

napisałem Ci że to złe podejście.

całe menu zrób w JS bez pomocy PHP ukrywając i zakrywając pewne elementy menu

linki w menu mają natomiast prowadzić do osobnych podstron zamiast ładowania tego przez AJAX

mógłbyś też zrobić zamiast ładowania osobnych podstron ładowanie w AJAX, ale to spowoduje problemy z optymalizacją strony pod kątem wyszukiwarek
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.