AJAX Page-Loader

  • AJAX Page-Loader

    Hallo Gemeinde,

    ich bin gerade dabei einen AJAX-Page Loader zu bauen, problematik ist ganz einfach er funktioniert nicht :).

    Der Pageloader soll immer wenn ein Link geklickt wird oder eine Form abgeschickt wird ein Lade-Icon anzeigen, solange bis die PHP-Applikation geladen ist.

    Mein bissheriger Code:

    Quellcode

    1. <script language="JavaScript">
    2. function createRequestObject() {
    3. var ro;
    4. var browser = navigator.appName;
    5. if(browser == "Microsoft Internet Explorer"){
    6. ro = new ActiveXObject("Microsoft.XMLHTTP");
    7. }else{
    8. ro = new XMLHttpRequest();
    9. }
    10. return ro;
    11. }
    13. var http = createRequestObject();
    15. function do_script() {
    16. document.getElementById("index").innerHTML = '<img src="ajax-loader.gif">';
    17. http.open('get');
    18. http.onreadystatechange = handleResponse;
    19. http.send(null);
    20. }
    21. function handleResponse() {
    22. if(http.readyState == 4){
    23. var response = http.responseText;
    24. document.getElementById("index").innerHTML = response;
    25. }
    26. }
    27. </script>
    28. <a OnClick='do_script' href="#">Script ausführen</a>
    29. <div id="index">test</div>
    Alles anzeigen


    mein icon habe ich mir auf http://www.ajaxload.info/ erstellt

    Hat wer ne idee wo der Fehler liegt oder was ich ändern muss?

    Danke

    so long JFoX
    Erst wenn der letzte FTP Server kostenpflichtig, der letzte GNU-Sourcecode verkauft, der letzte Algorithmus patentiert, der letzte Netzknoten kommerzialisiert, die letzte Newsgroup moderiert wird, werdet Ihr merken, dass man mit Geld allein nicht programmieren kann.

  • du gibst gar keine URL an.

    Quellcode

    1. http.open('get', 'url');


    Aufrufen solltest du das dann Script so:

    Quellcode

    1. <a onclick="do_script(); return false" href="#">...


    return false sorgt dafür, dass sich der center der seite nicht verändert.
    Die Anführungszeichen sollten einfach der Schönheit halber einheitlich sein.
    Und Attribute werden nach Konvention alle kleingeschrieben.

    Dann könnte es klappen. Hast du denn auch ein HTML Grundgerüst mit <head> und <body> drumherum?

  • Ok ich habe das jetzt abgeändert

    Quellcode

    1. http.open('get', 'url', 'post');


    Was komisch ist wenn ich dann auf einen Link klicke bekomme ich immer den Fehler: NOT FOUND The requested URL /url was not found on this server.

    Vorallem "/url", das habe ich nirgends angegeben. :(

    Hat da wer ne idee?

    so long

    JFoX
    Erst wenn der letzte FTP Server kostenpflichtig, der letzte GNU-Sourcecode verkauft, der letzte Algorithmus patentiert, der letzte Netzknoten kommerzialisiert, die letzte Newsgroup moderiert wird, werdet Ihr merken, dass man mit Geld allein nicht programmieren kann.

  • übergibst du denn auch den richtigen pfad? also es muss nicht der absolute pfad sein, obwohl das die sicherste methode wäre... aber wenn die meldung kommt "NOT FOUND" dann heist das meistens das er die datei in dem pfad nich finden kann...

    evtl mal dem pfad ein "../" vorranstellen bzw weglassen
    z.b.:

    "dein/pfad/zum/script/datei.php"

    oder

    "../dein/pfad/zum/script/datei.php"

    ansonsten mal n alert(url); mit einbauen vor dem aufruf und dann prüfen ob der stimmt

    so long
    .:Reden Ist Schweigen und Silber Ist Gold:.

    real programmers don't comment their code: if it was hard to write, it should be hard to read!

  • Ist mir klar das er was nicht finden kann :), nur meine frage wäre jetzt wo übergebe ich den pfad denn? :) Kann nicht wirklich prüfen, ob ich den Pfad richtig übergebe, da ich nicht weiß wo ich ihn übergeben muss bzw wo ich das eintragen muss :).

    //EDIT
    Ok habe das jetzt hinbekommen...

    Quellcode

    1. http.open('/home/htdocs/test/www');


    so klappts, das 'post' und 'get' einfach weg gemacht :( dachte das definiert die übergabe... aber naja so klappts erstmal, weiß nur nicht ob das, dass "gelbe vom Ei" ist was ich da gebaut habe :(
    Erst wenn der letzte FTP Server kostenpflichtig, der letzte GNU-Sourcecode verkauft, der letzte Algorithmus patentiert, der letzte Netzknoten kommerzialisiert, die letzte Newsgroup moderiert wird, werdet Ihr merken, dass man mit Geld allein nicht programmieren kann.

  • Das funktioniert, weil du auf deiner eigenen Kiste arbeitest. Das läuft aber nicht über den Webserver..

    JavaScript ist ja nur ein clientseitiges Script - du musst also entweder
    http://localhost/test/www oder /test/www oder www (vorausgesetzt du bist im Verzeichnis test) nehmen.

    Vor AJAX solltest du dir aber vielleicht nochmal die JavaScript Basics bei SelfHtml anschauen. Eine Funktionssignatur solltest du hinbekommen.

    Hier mal eine Möglichkeit:

    Quellcode

    1. <a href="ziel.php" onclick="return doScript(this.href)">aaa</a>

    Quellcode

    1. function doScript(url) {
    2. document.getElementById("index").innerHTML = '<img src="ajax-loader.gif">';
    3. http.open('get', url);
    4. http.onreadystatechange = handleResponse;
    5. http.send(null);
    6. return false;
    7. }

  • stimmt... get und post muss da nicht drin stehen... siehe

    Quellcode

    1. function do_script() {
    2. document.getElementById("index").innerHTML = '<img src="ajax-loader.gif">';
    3. http.open('get'); //<-- hier steht ja schon get
    4. http.onreadystatechange = handleResponse;
    5. http.send(null);
    6. }
    7. function handleResponse() {
    8. if(http.readyState == 4){
    9. var response = http.responseText;
    10. document.getElementById("index").innerHTML = response;
    11. }
    12. }
    Alles anzeigen


    du könntest, so hab ich es gemacht, den pfad fest kodieren in der JS datei, aber keine absoluten pfade verwenden...damit ist dein projekt auch auf andere server relativ problemlos portierbar

    wenn du zu dem problem kommst, mehrere anfragen "zeitnahe" auszuführen (gleichzeitig geht NICHT) meld dich einfach wieder oder schau ins wiki ;)
    .:Reden Ist Schweigen und Silber Ist Gold:.

    real programmers don't comment their code: if it was hard to write, it should be hard to read!