[ FoxVanis @ 20.05.2010. 14:15 ] @
Pozdrav slvima, treba mi jedna pomoć. Radim na jednom CMS sistemu i treba mi neki JavaScript kod gde će mi portal prikazivati nove poruke u realnom vremenu.

Naime, kada mi neko pošalje poruku, želim da mi se u brojaču gde broji koliko imam novih poruka, odmah pojavi broj novih poruka, da ne moram stalno osvežavati stranicu, nešto poput FaceBooka. Pokazaću Vam moj trenutni brojač u PHP-u.

Code:

<?php
## Proveri nove poruke ##
$LoginPorukeSQL="SELECT * FROM `tabela_poruke` WHERE `za_id`='".$clanID."' AND `procitana`='1' ";
$LoginPorukeQuery=mysql_query($LoginPorukeSQL);
$porukaBroj=mysql_num_rows($LoginPorukeQuery); // Pokazuje broj nepročitanih poruka
?>

Broj novih poruka [ <?php echo $porukaBroj;> ]


Ovo radi perfektno ali je problem što moram osvežavati stranicu da bih video da li je stigla nova poruka, zato sam hteo JavaScript da odmah ispiše.

Hvala u napred.
[ Phikret @ 20.05.2010. 15:23 ] @
OK tebi ovaj kod radi, samo sam nesto primetio. Valjda treba da upises 0 u kolonu 'procitana' ako je neprocitana poruka, a ne '1'.

E sad tvoje pitanje. Moras da koristis AJAX i da postavis timer da recimo na svakih 30 sekundi se izvrsi upit i azuriras HTML tog elementa koji ti prikazuje broj poruka.

Code:

<?php
## Proveri nove poruke ##
$LoginPorukeSQL="SELECT * FROM `tabela_poruke` WHERE `za_id`='".$clanID."' AND `procitana`='1' ";
$LoginPorukeQuery=mysql_query($LoginPorukeSQL);
$porukaBroj=mysql_num_rows($LoginPorukeQuery); // Pokazuje broj nepročitanih poruka
?>
[ FoxVanis @ 20.05.2010. 15:44 ] @
Nikada nisam koristio AJAX. Znam samo PHP, SQL, XML, HTML i CSS, Javascript osnovno. Još nisam počeo učiti AJAX ali sada radeći na ovom CMS-u ću naučiti.

Stavio sam procitana`='1' da mi prikazuje kada je nepročitana a 0 kada je otvorim. trebao sam polju dati ime "nepročitana". :)
Nebitno sada... Da li mi možeš pomoći nekim tutorijalom za AJAX? Nikada nisam radio takva povezivanja ili ako mi možeš dati smernice?

[Ovu poruku je menjao FoxVanis dana 20.05.2010. u 17:13 GMT+1]
[ stevs986 @ 20.05.2010. 23:43 ] @
Koristi malo jquery biblioteku.....

Konkretno pogledaj load metodu

$("#id_elementa").load();


i funkciju setTimeout


To ti resava problem...
[ FoxVanis @ 21.05.2010. 09:20 ] @
Potražiću. Slab sam sa javom, uglavnom sam radio na PHP programiranju, drugi su radili javu kada je trebalo ili sam koristio nešto već gotovo. Sad kada sam samostalan, moram da je savladam u potpunosti.

Gledao sam na netu te forme celu noć, isprobavao i ne radi mi. Meni treba da AJAX osvežava samo <DIV> tabelu. Shvatio sam da moram napraviti poseban PHP fajl u koji unosim PHP kod za vađenje iz baze podataka informacije i da je taj PHP unutar DIV-a. Na mesto u HTML-u gde želim da vidim taj broj, stavljam isti takav DIV ali prazan jerino mu ID mora biti isti kao ID iz onog DIV-a gde mi se prikazuje podatak. Onda AJAX vrti taj poseban fajl, stalno ga osvežava i čita sadržaj pa mi u HTML-u ispisuje te podatke. Probao sam oko 15 skripti, jedna je radila delimično ali mi je zapucavala server, ostale drugima, nekome radi, nekome ne, ali bih vam okačio da vidite na šta mislim.

brojPoruka.php
Code:

<div id="NovePoruke">
<?php
## Proveri nove poruke ##
$LoginPorukeSQL="SELECT * FROM `tabela_poruke` WHERE `za_id`='12' AND `procitana`='1' ";
$LoginPorukeQuery=mysql_query($LoginPorukeSQL);
echo mysql_num_rows($LoginPorukeQuery); // prikazuje broj poruka
?>
</div>


index.php
Code:

<html>
<body>
<script type="text/javascript">
function Ajax(){
var xmlHttp;
    try{    
        xmlHttp=new XMLHttpRequest();// Firefox, Opera 8.0+, Safari
    }catch (e){
        try{
            xmlHttp=new ActiveXObject("Msxml2.XMLHTTP"); // Internet Explorer
        }catch (e){
            try{
                xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
            }catch (e){
                alert("No AJAX!?");
                return false;
            }
        }
    }
    xmlHttp.onreadystatechange=function(){
        document.getElementById('NovePoruke').innerHTML=xmlHttp.responseText;
        setTimeout('Ajax()',2000);
    }
    xmlHttp.open("GET","brojPoruka.php",true);
    xmlHttp.send(null); 
}
window.onload=function(){
    setTimeout('Ajax()',2000);
}
</script>
<div id="NovePoruke"></div>
</body>
</html>


Može neko da me usmeri?
[ FoxVanis @ 21.05.2010. 10:58 ] @
DOŠAO SAM DO REŠENJA!!!!

Malo sam posetio stranicu W3 Schools i potražio AJAX programiranje. Za samo 7-8 minuta sam skontao i napisao skriptu od početka do kraja i dobio ovo:

brojPoruka.php
Code:

<div id="NovePoruke">
<?php
## Proveri nove poruke ##
$LoginPorukeSQL="SELECT * FROM `tabela_poruke` WHERE `za_id`='12' AND `procitana`='1' ";
$LoginPorukeQuery=mysql_query($LoginPorukeSQL);
echo mysql_num_rows($LoginPorukeQuery); // prikazuje broj poruka
?>
</div>


Code:

<html>
<header>
<script type="text/javascript">
function BrojPoruka()
{
    if (window.XMLHttpRequest)
      {    // Kod za prepoznavanje IE7+, Firefox, Chrome, Opera, Safari
          xmlhttp=new XMLHttpRequest();
      }
    else
      {    // Kod za prepoznavanje IE6, IE5
          xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
      }
    xmlhttp.onreadystatechange=function()
      {
          if (xmlhttp.readyState==4 && xmlhttp.status==200)
               {
            document.getElementById("BrojPoruka").innerHTML=xmlhttp.responseText;
            setTimeout('BrojPoruka()',5000);
               }
    }
    xmlhttp.open("GET","brojac.php",true);
    xmlhttp.send();
    window.onload=function()
    {
        setTimeout('BrojPoruka()',5000);
    }
}
</script>
</header>
<body onload="BrojPoruka()">
<div id="BrojPoruka"></div>
</body>
</html>


SKRIPTA RADI PERFEKTNO!!!
Znači: u početku mu se određuje funkcija i sve se radi u njoj. Prvo se podešava "xmlhttp" za vrste pretraživača. Zatim se izvlače podatci iz ID-a, otvara se i gleda stranica, podešava refresh metod i to je to. U body tag se ubacuje onload="BrojPoruka()" koji govori javascriptu da pokrene učitavanje i on se vrti svo vreme. Prosto kao pasulj.

Umesto DIV taga možete koristiti FONT, SPAN, TABLE i mnoge druge tagove samo određujete ID kao indentifikator. Ovime možete proveravati nove poruke, nove sadržaje, broj poruka, posetioce, registrovane članove itd...
Ako imate šta dodati, ispraviti ili oduzeti, slobodno.

Hvala vam ipak na ukazanoj pažnji.

PS: Evo Vam za poklon moja skripta za CMS:

Code:
<script type="text/javascript">
var URLbrojaca = 'brojac.php';
var IDbrojaca = 'BrojPoruka';
var VremeBrojaca = 5000; // Milisekundi
function BrojPoruka()
{
    if (window.XMLHttpRequest){xmlhttp=new XMLHttpRequest();}
    else
      {xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");}
    xmlhttp.onreadystatechange=function()
      {
          if (xmlhttp.readyState==4 && xmlhttp.status==200)
        {
            document.getElementById(IDbrojaca).innerHTML=xmlhttp.responseText;
            setTimeout('BrojPoruka()',VremeBrojaca);
        }
    }
    xmlhttp.open("GET",URLbrojaca,true);
    xmlhttp.send();
    window.onload=function(){setTimeout('BrojPoruka()',VremeBrojaca);}
}
</script>


Tamo gde su upisani VAR parametri možete staviti PHP kod pa preko baze ili XML-a možete podešavati u administraciji intervale prikaza ili isti kod koristiti za više stvari u zavisnosti šta vam je potrebno.