Ajax w jquery JSON we współpracy z PHP: Różnice pomiędzy wersjami

Z Podręcznik Administratora by OPZ SGU
Przejdź do nawigacji Przejdź do wyszukiwania
m
m (Zastępowanie tekstu - "<source lang="html4strict">" na "<pre>")
 
(Nie pokazano 5 wersji utworzonych przez 2 użytkowników)
Linia 18: Linia 18:


Kod HTML
Kod HTML
<source lang="html4strict">
<pre>
<script type="text/javascript" src="jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="jquery-1.3.2.min.js"></script>
<script>
<script>
Linia 27: Linia 27:
$.getJSON('plik_php.php?id='+$id, {}, function(json){  
$.getJSON('plik_php.php?id='+$id, {}, function(json){  
                   $('#tresc').html('');
                   $('#tresc').html('');
                       $('#tresc').append('tresc: '  + json.note.tresc + '<br/>')
                       $('#tresc').append('tresc: '  + json.nasztekst.tresc + '<br/>')
                                 .append('Odswierzen: ' + json.note.id + '<br/>')
                                 .append('Odswierzen: ' + json.nasztekst.id + '<br/>')
                                 .append('<br/> ');
                                 .append('<br/> ');
                                 $id=json.note.id;
                                 $id=json.nasztekst.id;
                                  
                                  
         });
         });
Linia 41: Linia 41:
</div>
</div>
<div id="sendit"> <button >Odswierz</button> </div>
<div id="sendit"> <button >Odswierz</button> </div>
</source>
</pre>




Kod PHP dla plik_php.php
Kod PHP dla plik_php.php


<source lang="php">
<pre>
<?php
<?php
$id= ($_GET['id']);
$id= ($_GET['id']);
Linia 52: Linia 52:
$arr = array ('tresc'=>1,'id'=>$id);
$arr = array ('tresc'=>1,'id'=>$id);
echo("{");
echo("{");
echo('note:');
echo('nasztekst:');
echo json_encode($arr);
echo json_encode($arr);
echo("}");
echo("}");
?>
?>
</source>
</pre>




Efekt:
Efekt:
[[Plik:Dzialanie skryptu drobnego.png|200px|thumb|right|Działanie powyższego skryptu]]
[[Plik:Dzialanie skryptu drobnego.png|200px|thumb|right|Działanie powyższego skryptu]]
[[Category:PHP]]
[[Category:HTML]]
[[Category:javascript]]

Aktualna wersja na dzień 00:58, 16 lut 2018

JSON - to format przekazywania danych, ma on mniej skomplikowaną strukturę niż XML który obudowuje wszystko w podwójne tagi. JSON - bez problemu może być wspierany przez jquery do tworzenia dynamicznych stron.


Poniżej umieszczam przykład zastosowania.


formularz zliczający ilość odświeżeń strony, w oparciu o PHP - przykład pokazuje interakcje ze skryptem PHP, wróćcie uwagę iż skrypt można zastosować w wielu przypadkach.

Np do wyświetlania wiadomości tekstowych, shoutboxa lub dowolnej innej operacji. Pod ID wystarczyło by podłożyć pobieranie z serwera SQL.


Wymagana jest darmowa biblioteka jquery.


Kod HTML

<script type="text/javascript" src="jquery-1.3.2.min.js"></script>
<script>
$(document).ready(function(){
$id=0;
 $('#sendit').click(function()
    {
$.getJSON('plik_php.php?id='+$id, {}, function(json){ 
                  $('#tresc').html('');
                      $('#tresc').append('tresc: '   + json.nasztekst.tresc + '<br/>')
                                 .append('Odswierzen: ' + json.nasztekst.id + '<br/>')
                                 .append('<br/> ');
                                 $id=json.nasztekst.id;
                                 
         });
      })
});

</script>

<div id="tresc">
</div>
<div id="sendit"> <button >Odswierz</button> </div>


Kod PHP dla plik_php.php

<?php
$id= ($_GET['id']);
$id++;
$arr = array ('tresc'=>1,'id'=>$id);
echo("{");
echo('nasztekst:');
echo json_encode($arr);
echo("}");
?>


Efekt:

Działanie powyższego skryptu