Dinamičko pozivanje PHP-a uz pomoć jQuery-ja / plagosus / blog

Dinamičko pozivanje PHP-a uz pomoć jQuery-ja

Evo jednog kratkog i jednostavnog primera koji pokazuje kako se iz statičkog XHTML fajla, uz pomoć jQuery JavaScript biblioteke može pozvati eksterni PHP fajl koji obrađuje vrednost izabranu u padajućoj listi na XHTML stranici i bez ponovnog učitavanja cele stranice, dinamički vraća rezultat obrade nazad.

Za potrebe ovog primera, odabrao sam jednostavno računanje kvadrata broja izabranog u padajućoj listi. Iz “stranica.xhtml” datoteke, bira se broj iz liste i klikom na dugme “Okini“, JavaScript funkcija iz datoteke “funkcije.js” poziva eksterni PHP fajl “obrada.php” koji računa kvadrat broja i vraća vrednost nazad u polje “<span id=”rezultat”>NaN</span>” koje se nalazi u početnoj XHTML stranici.

Da bi probali ovu skriptu, potrebno je da u istom folderu napravite sledeće datoteke sa sadržinom koja je navedena:

stranica.xhtml


<select name="broj"> <option value="1">Jedan</option></select>
<select name="broj"> <option value="2">Dva</option></select>
<select name="broj"> <option value="3">Tri</option></select>

Kvadrat izabranog broja je: <span id="rezultat">NaN</span>

<button id="dugme">Okini</button>

funkcije.js

// Funkcija koja poziva eksterni PHP fajl i ucitava rezultat
function funkcija(value) {
$('#rezultat').load('obrada.php?broj='+ value);
}

// Okidac koji klikom na dugme poziva funkciju
$(document).ready(function() {
$("#dugme").click(function() {
// Uzimamo vrednost iz padajuceg menija
funkcija(document.getElementById('broj').value);
});
});

obrada.php

< ?php
// Ulaz: Provera da li je poslata vrednost za $broj
if(isset($_GET['broj'])) {
$broj = $_GET['broj'];
}
else {
$broj = "NaN";
}

// Obrada: Racunanje kvadrata broja
$rezultat = $broj * $broj;

// Izlaz: Ispis rezultata rada
echo ($rezultat);
?>
Ostaje samo još jquery.js biblioteka, koju možete preuzeti sa zvaničnog sajta.
Kako se WP plugin za syntax highlight koda čudno ponaša sa ovim primerima, postavio sam i probni kod, kao i arhivu sa celim primerom.
Nadam se da će ovo nekome biti korisno 🙂
DEMO
DOWNLOAD
Podeli sa prijateljima...Share on Facebook0Tweet about this on TwitterShare on Google+0Share on LinkedIn0

7 responses to “Dinamičko pozivanje PHP-a uz pomoć jQuery-ja”

  1. Jel moze da se sredi da ne mora da se klikne na `OKINI` ?

    • brankko says:

      Ne mora, mozes funkcija() da pozivas bilo gde. Npr mozes da stavis:
      <select id="broj" name="broj" onBlur="funkcija(document.getElementById('broj').value);" >
      I pozivace se PHP automatski kad nesto izmenis u padajucoj listi. Moze to isto i u samom JS tj jQuery-ju. Bitno je samo da se na bilo koji nacin pozove funkcija();

      • Kuul 😀
        imam ideju da na naslovnoj strani bloga imam spisak postova sa datumima objavljivanja a da klikom na jedan od naslova otvori post unutar te stranice .. sto mi lici na ovo
        al sad bas nesto nemam vremena sad ce prijemni a morao bi da proucim sve to

        • brankko says:

          To je taj fazon… Em radi brze, em je efektivnije… Mozes da dodas eventualni neki loader… animacijicu neku za ucitavanje ili tako nesto…

  2. Dušan says:

    Ne treba ti sirovi getElementById kad koristiš jQuery, zar ne? 🙂

  3. bonaca says:

    Ima li ovo bilo kakvu prednost u odnosu na "method: POST;" varijantu ?

Leave a Reply

Your email address will not be published. Required fields are marked *