Avatar billede nicolailissau Nybegynder
23. maj 2009 - 15:54 Der er 13 kommentarer og
2 løsninger

Behandle AJAX output

Hej Eksperter.

Jeg sidder og laver noget AJAX(er helt ny i det).
Jeg vil gerne lave en liste med output fra en database. Jeg har lavet det script der bliver hentet af AJAX. Scriptet outputter data fra en database i et javascript array.

PHP koden ser således ud:
<?php
include("mysqlconnection.php");
$connect = mysql_query("SELECT * FROM newsbase ORDER BY newsid DESC");
while($row = mysql_fetch_array($connect)){
echo "response.push('".$row['newstitle']."'); ";
}
?>
Som i kan se bruger jeg JS push() til at lave outputtet til et javascript array.
Arrayet bliver lavet i min index fil:
ajaxRequest.onreadystatechange = function(){
        if(ajaxRequest.readyState == 4){
            response = new Array();
            //php output fra ajaxRequest.responseText;
        }

Mit spørgsmål er hvordan jeg udskriver det JS array som PHP scriptet laver, i funktionen herover.

Håber i kan hjælpe. Hvis det er utydeligt hvad jeg skriver må i endeligt spørge igen.

Mvh
Avatar billede ebusiness Nybegynder
23. maj 2009 - 16:15 #1
Det spørgsmål tog lidt tid at tygge igennem, for lige at få det på plads, du tror på at du har læst arrayet korrekt ind og skal bare vise det til brugeren?

Den hurtige måde at se hvad dit array indeholder er vha. en alert:

window.alert(ditArray.join(","))

Den lidt pænere måde at vise det på er at fylde teksten ind i et element vha. innerHTML.

En tom div:
<div id="arrayviser"></div>

Og så kode som fylder i diven:
document.getElementById("arrayviser").innerHTML=ditArray.join("<br>")
Avatar billede nicolailissau Nybegynder
23. maj 2009 - 16:24 #2
Undskyld hvis det var lidt uforståeligt :)
Ja er sikker på arrayet er godt nok. Du kan se på www.rtgkom.dk/~nicolails07/test/ajax/nyheder.php. Det der scriptet ligger og det er det output der bliver hentet med AJAX.

Jeg skal jo så bruge javacript arrayet til at tilføje baggrundsfarver og borders til hvert element i arrayet.
Sådan så jeg får en listeform.
Det er derfor jeg ønsker at lave arrayet i det hele taget.

Jeg benytter mig så bare af DOM i stedet. Har et div tag hvor listen skal blive vist

var src=document.getElementById("listMenu");
src.firstChild.nodeValue = //listen(arrayet) vist med bg farver og borders ;

Mvh
Avatar billede nicolailissau Nybegynder
23. maj 2009 - 16:25 #3
Du skal lige fjerne punktummet efter linket :)
Avatar billede ebusiness Nybegynder
23. maj 2009 - 17:22 #4
Du kan jo umiddelbart bare lave en streng med HTML elementer og hele pivetøjet og så oprette elementerne ved at indsætte den vha. innerHTML.

Fx:
htmlstreng="<table><tr><td>"+response.join("<\/td><\/tr><tr><td>")+"<\/td><\/tr><\/table>"
src.innerHTML=htmlstreng

Så har du en simpel tabel med en celle for hvert element.
Avatar billede tjens Nybegynder
23. maj 2009 - 19:58 #5
Er der ikke en lille fejl i dit originale spørgsmål?
Dit php-script outputter ikke et javascript array, men derimod en tekststreng bestående af flere javascript push kommandoer.

Det eneste du skal er at køre eval() på tekststrengen.
Så vil dit array response få tilføjet værdierne.

Demo testet i FF3 og MSIE7:

    var response = new Array();
    var text = "response.push('First'); response.push('Second'); response.push('Third');";
    eval(text);
    alert(response);
Avatar billede andreas13_fam Nybegynder
23. maj 2009 - 20:17 #6
Men innerHTML er bare ikke valid, desuden er det du for tilbage tekst. Du kan lave det om til javaScript med eval.

Eksempel med eval og ingen innerHTML
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>TEST</title>
<body>
<div id="test"></div>
<script type="text/javascript">
function dump(arr,level) {
    var dumped_text = "";
    if(!level) level = 0;
   
    //The padding given at the beginning of the line.
    var level_padding = "";
    for(var j=0;j<level+1;j++) level_padding += "    ";
   
    if(typeof(arr) == 'object') { //Array/Hashes/Objects
        for(var item in arr) {
            var value = arr[item];
           
            if(typeof(value) == 'object') { //If it is an array,
                dumped_text += level_padding + "'" + item + "' ...\n";
                dumped_text += dump(value,level+1);
            } else {
                dumped_text += level_padding + "'" + item + "' => \"" + value + "\"\n";
            }
        }
    } else { //Stings/Chars/Numbers etc.
        dumped_text = "===>"+arr+"<===("+typeof(arr)+")";
    }
    return dumped_text;
}

response = new Array();
responseText = "response.push('Ny JavaSript restriction i gæstebogen'); response.push('Opgave site funktionelt'); response.push('Under udvikling');";
eval(responseText);

var table = document.createElement('table');
    table.setAttribute('border','1');
        var tr = document.createElement('tr');
            var td = document.createElement('td');
                td.appendChild(document.createTextNode('Num'));
            tr.appendChild(td);
            var td = document.createElement('td');
                td.appendChild(document.createTextNode('value'));
            tr.appendChild(td);
        table.appendChild(tr);
       
        for (var i=0;i<response.length;i++)
        {
        var tr = document.createElement('tr');
            var td = document.createElement('td');
                td.appendChild(document.createTextNode(i));
            tr.appendChild(td);
            var td = document.createElement('td');
                td.appendChild(document.createTextNode(response[i]));
            tr.appendChild(td);
        table.appendChild(tr);
        }
document.getElementById('test').appendChild(table);
</script>
</body>
</html>
Avatar billede andreas13_fam Nybegynder
23. maj 2009 - 20:18 #7
når ja, havde ikke set at tjens også havede skrævet det (det var spise tid)
Avatar billede ebusiness Nybegynder
23. maj 2009 - 21:56 #8
Man kan jo diskutere for og imod brugen af innerHTML, men fakta er at alle moderne browsere understøtter innerHTML. W3C har aldrig rigtig haft noget at skulle have sagt mht. Javascript, de facto standard er hvad der virker i browserne, det er selvfølgelig ikke altid lige smart, men en stor del af funktionerne, herunder innerHTML, er rimeligt veldefinerede over hele linjen, hvilket er mere end man kan sige om en stor del af de ting som er W3C standarder.
Avatar billede nicolailissau Nybegynder
24. maj 2009 - 15:10 #9
Tak for de mange svar!

#Ebusiness
Jeg sværger lidt til DOM i stedet. Men innerHTML kan selvfølgelig også bruges. Men jeg kan ikke lave en streng med HTML elementer, for så vil de bare blive skrevet ud på siden. Den løsning har jeg prøvet.

#Tjens
Jov det var det jeg mente :) det er helt korrekt at det er en tekststreng jeg har med push-kommandoer.

eval() virker helt perfekt til formålet og da både andreas og tjens har det rigtige svar, deler jeg pointene mellem jer.

Tak for hjælpen!
Avatar billede ebusiness Nybegynder
24. maj 2009 - 16:09 #10
innerHTML opretter de elementer du skriver, innerText (IE funktion som bestemt ikke kan anbefales) gør ikke.
Avatar billede andreas13_fam Nybegynder
25. maj 2009 - 07:52 #11
InnerHTML er noget jeg ikke gider og diskuter søg 1min på eksperten og det er gjort. Men god tur til dem som skifter til XHTML 2.0 :)
Avatar billede ebusiness Nybegynder
25. maj 2009 - 13:14 #12
Hvis du ikke gider at diskutere innerHTML kunne det være at du skulle lade være med at udtale dig om funktionen til at starte med. Det er simpelthen for plat at komme med sådan et angreb og så i øvrigt nægte at tage en saglig diskussion.
Avatar billede andreas13_fam Nybegynder
25. maj 2009 - 14:41 #13
Det har nu aldrig været min mening at kommentaren skulle anses for at være et angreb. Det eneste mål var at åbne andres øjne for at der findes andet end innerHTML. I den tanke at jeg selv engang ikke vidste der fandtes alternativer. Når det er sagt vil jeg gerne indrømme at jeg selv gør brug af "færdig lavede scripts" som indeholder innerHTML. Jeg er nemlig ikke en kriger som OleBole, der med gælde tager diskussionen op, og desuden er jeg slet ikke lige så erfaren og derved kan jeg komme ud på et vildspor hvor jeg udtaler mig om noget jeg ikke ved.

Jeg håber du forstår at jeg ikke ønsker at erklære krig, men bare åbner øjne for alternativer, det er jo programmøren selv der må tage beslutningen, ingen kan tvinge vedkommende.

Citat  (med vilje manglede henvisning, resten bør kun læses hvis man er nysgerrig, og derved "googler" sig frem til linket):
Ikke mindst i forbindelse med udbredelsen af Ajax er debatten om innerHTML - som middel til at ændre websiders struktur - blusset voldsomt op. Som vanligt er vi webkodere delt i to lejre: Én, hvor innerHTML tilbedes - og én, hvor DOM (Document Object Model) tilbedes - og i begge lejre rystes håbløst på hovedet af 'de andre' ... 'de vantro ignoranter'.
Avatar billede majbom Novice
25. maj 2009 - 21:33 #14
-> ebusiness - en af tingene der er skidt ved at bruge innerHTML er memoryleaks - det svinger fra browser til browser, men det er der, og det kan tydeligt mærkes på en side der benytter sig af det, når du smider mange elementer osv. i et andet element med "løsningen"!

DOM er vejen frem, uanset om alle browsere understøtter det, vil det ikke være en del af standarderne og når browserne begynder at holde sig til standarderne bliver der meget arbejde i at lave det om.
Avatar billede ebusiness Nybegynder
26. maj 2009 - 00:14 #15
Jeg prøvede i mine fem testbrowsere med den mest "beskidte" innerHTML app jeg har skrevet, Scriptris: http://ebusiness.hopto.org/scriptris/

Der oprettes 200 image elementer + en sjat per spiller hver gang man starter et nyt spil og de gamle elementer fjernes ved at innerHTML overskriver.

Den eneste browser hvor det gav nogen seriøs ændring i ram forbruget at starte nye 4 spiller spil så hurtigt som min mus kunne følge med var Firefox, den tog vel ~10MB for hvert nyt, men så engang imellem kørte garbage collectoren og den røg tilbage til udgangspunktet, jeg tror ikke at DOM funktionerne havde ændret meget på den opførsel. Så nej, ingen indikation af at innerHTML skulle give specielle problemer med memory leaks. Hvis du skulle ligge inde med testdata som siger noget andet skal du endelig ikke holde dem tilbage.

At browserne skulle stoppe med at understøtte innerHTML? Måske i en fremtidig HTML version hvis W3C finder på et alternativ der er lidt mere ligetil en DOM. Men i de nuværende HTML versioner? Det har jeg svært ved at tro.

PS. Der er ingen grund til at kritisere min kodestil i Scriptris, den er ændret en del siden jeg skrev det program.
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