Szukam skryptu z rozwijanym tekstem

[milanista7]

Cześć. Szukam takiego skryptu, dzięki któremu po kliknięciu w daną pozycję automatycznie bez żadnego odświeżania strony, na tej samej podstronie pojawił się tekst do tej pozycji. Macie coś takiego ?

[Leja]

Na blogu Labasty coś takiego jest.. http://websta.pl/tutoriale/jquery-czesciowe-rozwijanie-i-zwijanie-tabeli
Pozdrawiam!

Edit: Tu masz demo tego.. http://demo.websta.pl/tabela/index.html

[BeamBear]

jquery to chyba aż nadto do takiego prostego zadania AJAX Ci pomoże.

Po pierwsze - tworzysz sobie skrypt php który w zależności od przekazanego parametru wyświetli Ci zadaną treść. Innymi słowy, przykładowy skrypt wygląda tak:

Kod PHP:

<?php
//sprawdzasz czy jest coś przekazane do skryptu
//jest - a zatem zmieniasz wyswietlany tekst
if (isset($_GET["tekst_id"])) 
 {
  //najprościej według tego co przekazane jest
  switch ($_GET["tekst_id"])
   {
    case 1:
     echo '<p>tekst 1</p>';
    break;

    case 2:
     echo '<p>tekst 2</p>';
    break;
    }
 }
//nie ma wyświetlasz zwykły tekst
else
 {
  echo '<p>TEKST STANDARDOWY, POWITALNY, CZY JAKI TAM CHCESZ</p>';
 } 


Oczywiście - zamiast tekst_id, możesz sobie zmienną nazwać jak chcesz. Możesz również zamiast liczb przesyłać słowa, tylko pamiętaj, żeby wówczas w poszczególnych case w instrukcji switch umieszczać te słowa między cudzysłowami.

Dalej - prosty skrypt javascript (nie zamierzam się rozpisywać specjalnie długo, podaję Ci tylko ramy rozwiązania)

Kod:

var XMLHttpRequestObject = false;

if (window.XMLHttpRequest)
{
  XMLHttpRequestObject = new XMLHttpRequest();
}
else if (window.ActiveXObject)
{
  XMLHttpRequestObject = new ActiveXObject("Microsoft.XMLHTTP");
}

function pokazOpis(identyfikatorTekstu, warstwaDocelowa)
{
  if(XMLHttpRequestObject)
  {
  //warstwa wyświetlania opisu - mozna to oczywiscie zdefiniowac na stale
  var warstwaDocelowa = document.getElementById(warstwaDocelowa);
  //identyfikator tekstu który ma zostać wyświetlony
  var identyfikatorTekstu = (identyfikatorTekstu);

  //zmienna dla pamięci podręcznej przeglądarki - na wszelki wypadek
  var losowe = parseInt(Math.random()*999999999);
  //skrypt php który wyświetli co trzeba, ten wczesniej napisany
  var url = "opisy.php?tekst_id=" + identyfikatorTekstu;
  url += "&rand=" + losowe;



  XMLHttpRequestObject.open ("GET" , url, true);
  XMLHttpRequestObject.onreadystatechange = function()
   {
    if (XMLHttpRequestObject.readyState == 1 ||   XMLHttpRequestObject.readyState == 2 || XMLHttpRequestObject.readyState == 3)
       {
        var str='Trwa pobieranie opisu, czekaj...';
        warstwaDocelowa.innerHTML = str;
       }
        
      if (XMLHttpRequestObject.readyState == 4 && XMLHttpRequestObject.status == 200)
       {
        var str = XMLHttpRequestObject.responseText;
        warstwaDocelowa.innerHTML = str;

        
       }
   }
  XMLHttpRequestObject.send(null);
}
}

A potem tworzysz sobie dokument html

Kod:

<div id="warstwaDocelowa"></div>
<div id="elementy">
<ul>
  <li><a href="#" onclick="pokazOpis('1','warstwaDocelowa');">element 1</a></li>
  <li><a href="#" onclick="pokazOpis('2','warstwaDocelowa');">element 2</a></li>
</ul>
</div>

Dołączasz plik javascriptu do dokumentu i już. Skrypt wpisuje z głowy, więc nie daję Ci gwarancji, że zadziała, ale powinieneś już łapać ogólny pomysł