Avatar billede -zonic- Nybegynder
11. juni 2008 - 16:26 Der er 33 kommentarer og
1 løsning

ajax script opdateres ved ændring?

Hej,

jeg har brugt dette script til nogle forskellige elementer på et site så hele designet ikke skal opdateres hele tiden når man klikker lidt rundt... jeg tænker på om det evt kan udvides således at den chekker ex. hvert 5-10 sekund om noget i db'en er ændret, og hvis der er ændringer så opdateres den...?

nogle der kan udvide scriptet? :)


<script type="text/javascript">
   
   
    function ajaxFunction(v){  //parameteren v bruges til at bestemme hvilket link, der er klikket på
        var xmlHttp;            //Variabel oprettes       
        try{                  // Forsøg at
        xmlHttp=new XMLHttpRequest();    //oprette en XMLHttpRequest. Lykkedes hvis Firefox, Opera 8.0+, Safari 
        }
        catch (e){              // Ved fejl forsøges: Internet Explorer. 
            try{             // Gentagelse af ovenstående. Denne gange forsøges først IE 6.0+
            xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");   
            }
            catch (e){     
                try{        // Så forsøges Internet Explorer 5.5+
                xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");       
                }
                catch (e){    // Hvis vi har fået fejl gennem alle forsøgende gives fejlmeddelse
                alert("Your browser does not support AJAX!");       
                return false;       
                }     
            }   
        } 
   
        xmlHttp.onreadystatechange=function(){     //funktion der tjekker om data er kommet og gemmer dem
            if(xmlHttp.readyState==4){  // når informationerne er hentet fra serveren og klar til brug
                document.getElementById("tekst").innerHTML=xmlHttp.responseText; //skiftes det eksisterende
            }        //indhold i div-tagget ud med de hentede data.

        }
       
        if(v==1){    //her sættes en variabel der skifter indhold alt efter hvilket link brugeren har klikket
        var tekster = "nyheder1.php"; //her bestemmer du hvilke filer du skal hente. Mine hedder "nyheder1_2_3.php"
        }
        if(v==2){
        var tekster = "nyheder2.php";
        }
        if(v==3){
        var tekster = "nyheder3.php";
        }
       
        xmlHttp.open("GET",tekster,true); //request sendes til serveren. variablen 'tekster' kan også skiftes ud med et filnavn.
        xmlHttp.send(null);
    }

    </script>

    <p>

    <a href="#" onclick="ajaxFunction(1)" >Nogle nyheder</a>
    <a href="#" onclick="ajaxFunction(2)" >Andre nyheder</a>
    <a href="#" onclick="ajaxFunction(3)" >Flere nyheder</a>

    </p>
   
    <p>
   
    <div id="tekst">
        <?php include("nyheder1.php") ?>
    </div>
   
    </p>
Avatar billede w13 Novice
11. juni 2008 - 16:39 #1
Det skal du jo tjekke med PHP, dvs. på nyhederX.php-siderne.
Så kan du f.eks. udskrive et nul (0).
Så kan du i JavaScript teste, om der er udskrevet nul, for så skal siden jo ikke opdateres.
Avatar billede -zonic- Nybegynder
11. juni 2008 - 17:00 #2
glem de der faneskift... det er mere selve det indhold der er loaded som skal chekkes...
Avatar billede -zonic- Nybegynder
11. juni 2008 - 17:00 #3
det skal jo kunne gøres uden siden opdateres...og php kan jo ikke bare læses uden siden opdateres. det er jo selve ajaxdelen der skal gøre det?
Avatar billede w13 Novice
11. juni 2008 - 19:39 #4
Jo, PHP kan jo netop læses med Ajax. :) Og Ajax er jo JavaScript. Men derudover kan JavaScript på ingen måde læse i din database, så derfor skal du - via Ajax - aflæse det med PHP, som jeg beskrev.

Så du kan bruge samme Ajax-kode som nu, kun med den ændring, at:

if(xmlHttp.readyState==4){  // når informationerne er hentet fra serveren og klar til brug
    document.getElementById("tekst").innerHTML=xmlHttp.responseText; //skiftes det eksisterende
}

bliver til:

if(xmlHttp.readyState==4){  // når informationerne er hentet fra serveren og klar til brug
    if(xmlHttp.responseText!="0"){
        document.getElementById("tekst").innerHTML=xmlHttp.responseText; //skiftes det eksisterende
    }
}
Avatar billede -zonic- Nybegynder
12. juni 2008 - 12:07 #5
hmmm...jeg forstår ikke helt hvad !=0 fortæller om noget er opdateret eller ej? :)

hvordan får jeg den til at chekke ex. hvert 5 sekund? :)
Avatar billede w13 Novice
12. juni 2008 - 12:42 #6
Du kan f.eks. kalde:

<script type="text/javascript">
window.setTimeout("ajaxFunction(1)",5000);
</script>

Den vil jo så køre ajaxFunction(1) hvert 5000. ms., dvs. hvert 5. sekund.

!="0" fungerer jo så kun, hvis du i din PHP-fil sætter den til at skrive "0", hvis der ikke er sket noget siden sidst. Det er den eneste måde.
Avatar billede -zonic- Nybegynder
12. juni 2008 - 21:01 #7
men sådan som det her fungerer.. er det det vi kalder slamkode, eller er det sådan man bygger AJAX op?  jeg har et shoutcast script, som egentlig fungerer lidt på samme måde som det jeg vil... jeg synes bare det er meget mere javakode, og ser noget mere avanceret ud?
Avatar billede w13 Novice
12. juni 2008 - 21:13 #8
Jaeh, dit AJAX-script bruger bl.a. "GET" i stedet for "POST".
Det er lidt slam.
Avatar billede olebole Juniormester
13. juni 2008 - 00:11 #9
<ole>

Hvis du bruger wrapperen fra:
    http://www.dengodekode.dk/artikler/ajax/xmlhttprequest_wrapper.php

- kan du nøjes med:

    function ajaxFunction(v){  //parameteren v bruges til at bestemme hvilket link, der er klikket på
        var xmlHttp=new XMLHttpRequest();     
   
        xmlHttp.onreadystatechange=function(){    //funktion der tjekker om data er kommet og gemmer dem
            if(xmlHttp.readyState==4){  // når informationerne er hentet fra serveren og klar til brug
                document.getElementById("tekst").innerHTML = xmlHttp.responseText; //skiftes det eksisterende
            }        //indhold i div-tagget ud med de hentede data.

        }

- og have en væsentig mere moderne kode ... vi er efterhånden oppe i MSXML2.XMLHTTP.6.0  ;o)

Derudover er det absolut 'slammet' at bruge innerHTML. Den har aldrig været valid og er et levn fra version 4 browserne, hvor der ikke var andre muligheder ... men det har der været de seneste 8 årstid!  ;o)

I dag bør man afgjort bruge DOM til indsættelse af HTML. Serveren bør aldrig formatere data i HTML, men bør i stedet levere data i JSON eller XML. Du kan evt. se nogle eksempler på Ajax med PHP/JSON her:
    http://www.eksperten.dk/spm/817625

/mvh
</bole>
Avatar billede -zonic- Nybegynder
13. juni 2008 - 17:44 #10
ehmm... der står jo en helvedes masse kode i den wrapper..? :) hvad er det jeg skal bruge?
Avatar billede olebole Juniormester
13. juni 2008 - 22:39 #11
Koden  =)
Avatar billede -zonic- Nybegynder
15. juni 2008 - 23:43 #12
kan du prøve lige at sætte det op for mig sådan som det skal laves, hvis det skal virke som det script jeg havde ?  :) kan ikke hitte ud af det :(
Avatar billede -zonic- Nybegynder
18. juni 2008 - 20:20 #13
oole :)
Avatar billede -zonic- Nybegynder
29. august 2008 - 02:42 #14
w13, jeg har kigget lidt videre på det du skrev.. jeg forstår dog ikke helt hvad det er du vil med det 0 ? hvis vi antager at den fil jeg henter ind hedder news.php... jeg kan så inde i news.php lave således at hvis der ikke er opdateret noget inden for ex. 5 sekunder, så laver den echo 0.. men det får jeg ikke noget ud af... jeg skal næsten bruge et eksempel for at komme videre... ?
Avatar billede w13 Novice
29. august 2008 - 07:56 #15
Jo, for du modtager jo det, som filen udskriver, med koden:

xmlHttp.responseText;

Og så kan du teste, om du ikke har udskrevet "0" ved f.eks. at skrive:

var sOutput=xmlHttp.responseText;

if(sOutput!="0"){
  //Gør ting her
}
Avatar billede w13 Novice
29. august 2008 - 07:57 #16
Du kan også udskrive "false" i stedet, hvis du synes, det er federe. =)
Avatar billede -zonic- Nybegynder
29. august 2008 - 12:54 #17
jeg har gjort sådan her.:

i ajax scriptet.:

if(xmlHttp.readyState==4){  // når informationerne er hentet fra serveren og klar til brug
    if(xmlHttp.responseText!="0){
        document.getElementById("testdiv1").innerHTML=xmlHttp.responseText; //skiftes det eksisterende
    }
}    //indhold i div-tagget ud med de hentede data.

        }

i filen som jeg henter .:

$result = mysql_query("SELECT datereg FROM bolde WHERE UNIX_TIMESTAMP(datereg) > UNIX_TIMESTAMP(NOW())-20 LIMIT 1");
$num = mysql_num_rows($result);
if($num == 0) { echo '0'; } else {

udskriv det du skal

}

men det virker ikke...
Avatar billede -zonic- Nybegynder
29. august 2008 - 12:55 #18
den opdaterer stadig hver gang scriptet kører...

jeg loader i øvrigt scriptet således.:

<script type="text/javascript" language="javascript">
ajaxFunction1('bolde_seneste.php?name=786','');
setInterval("ajaxFunction1('bolde_seneste.php?name=786','')",
(5000));

</script>
Avatar billede w13 Novice
29. august 2008 - 12:55 #19
Du har skrevet:

if(xmlHttp.responseText!="0){

og ikke:

if(xmlHttp.responseText!="0"){
Avatar billede w13 Novice
29. august 2008 - 12:56 #20
Men det ville du jo kunne se, hvis du så på dine JavaScriptfejlbeskeder. =)
Avatar billede -zonic- Nybegynder
29. august 2008 - 13:10 #21
hov.. det var en lille fejl, fordi jeg havde prøvet 0 både uden og med "".. men det virker altså stadig ikke:)

dvs. det der sker er, at den opdaterer hver gang alligevel....
Avatar billede w13 Novice
29. august 2008 - 13:16 #22
Så må du jo finde ud af, hvad den modtager, ved at bruge:
alert(xmlHttp.responseText);
Avatar billede -zonic- Nybegynder
29. august 2008 - 14:31 #23
jeg ved ikke helt hvad der er lavet om, men nu virker det :)

men så er det sidste spørgsmål.... kan man ikke istedet på en måde chekke xmlHttp.responseText op med det der blev hentet sidste gang i stedet... fordi ellers skriver min fil jo bare 0 ud hver gang der ikke er sket noget.. og den skal jo stadig skrive det ud der står i filen.. den skal bare kun opdatere når der sker noget:)
Avatar billede w13 Novice
29. august 2008 - 14:40 #24
Kan du så ikke bare lade være med at overskrive det gamle? Ellers må du jo huske det sidste i en variable, du kan sammenligne med.
Avatar billede -zonic- Nybegynder
29. august 2008 - 14:48 #25
det jeg mener er... hvis vi antager at scriptet er ex. til en tagwall, så når filen kaldes ind første gang for at se de indlæg der er, skal den jo udskrive filens indhold normalt... og først derefter, skal den begynde og chekke om der sker ændringer..

og til det du skriver med at gemme det sidste i en variabel, hvordan gør jeg lige det... vil den variabel ikke dø hver gang functionen er kørt?
Avatar billede w13 Novice
29. august 2008 - 19:02 #26
Nej, ikke hvis du bruger en global variable, dvs. var'er den uden for funktionen.
Avatar billede -zonic- Nybegynder
31. august 2008 - 17:10 #27
fedt.. det virker. :)

tak for hjælpen...!

giv mig et svar, og du får points ;)
Avatar billede w13 Novice
31. august 2008 - 17:18 #28
;)
Avatar billede -zonic- Nybegynder
31. august 2008 - 18:19 #29
jeg har lige opdaget at mit script ikke virker på nogen måder i internet explorer udover på den computer hvor man sidder og opdaterer.. den laver en fejl.:

linie 86
tegn 3
fejl: 'document.getElementById(...)' is null or not an object


www.skovbakken-badminton.dk/nyside.php
Avatar billede -zonic- Nybegynder
03. september 2008 - 13:26 #30
øv... mistede jeg dig i svinget?
Avatar billede -zonic- Nybegynder
05. september 2008 - 14:06 #31
w13 ? :)
Avatar billede w13 Novice
05. september 2008 - 18:56 #32
Jeg ser ingen fejl og din linje 86 er CSS:

font: 12px "Lucida Grande", "Lucida Sans Unicode", Tahoma, Verdana, sans-serif;
Avatar billede w13 Novice
05. september 2008 - 18:56 #33
Men fejlen:

'document.getElementById(...)'

betyder jo, at elementet ikke findes. Det kan muligvis skyldes, at siden ikke er loadet ordentligt endnu, når scriptet kører.
Avatar billede w13 Novice
09. september 2008 - 13:53 #34
Tak for point! :)
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester