Ajax im IE bzw Firefox mit Fehlern

Diese Seite verwendet Cookies. Durch die Nutzung unserer Seite erklären Sie sich damit einverstanden, dass wir Cookies setzen. Weitere Informationen

  • Ajax im IE bzw Firefox mit Fehlern

    Hallo Ihr,

    habe mir das Beispiel Inhalte mit AJAX & PHP nachladen ein bisschen angepasst, habe jedoch noch folgende Probleme:

    1. im IE funktioniert der erste Aufruf ohne Probleme, wenn ich aber erneut in das Textfeld klicke und eine Änderung mache, aktualisiert er mir die Ausgabe beim verlassen nicht mehr.
    Ich habe jetzt schon den Cache versucht, auszuschalten, hilft aber leider nichts.

    2. im Firefox erhalte ich folgende Fehlermeldung beim verlassen des Textfeldes:
    Fehler: document.getElementById(update) has no properties
    Quelldatei: http://localhost/ajax/suggest.js
    Zeile: 42


    hier einmal der quelltext der drei dateien:

    suggest.html

    Quellcode

    1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    3. <head>
    4. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    5. <head>
    6. <meta http-equiv="Pragma" content="no-cache">
    7. <meta http-equiv="Cache-Control" content="no-cache">
    8. <meta http-equiv="Expires" content="Thu, 01 Dec 1994 16:00:00 GMT">
    10. <script language="JavaScript" src="suggest.js"></script>
    12. <style type="text/css">
    14. div {
    15. float:left;
    16. width:25%;
    17. font-size:10px;
    18. background-color:#e5e5e5;
    19. margin:10px;
    20. height:200px;
    21. width:175px;
    22. }
    24. </style>
    25. </head>
    26. <body>
    27. <br>
    28. <form name="f1">
    29. <span id="name">
    30. Geben Sie den Nachnamen ein:<br>
    31. <input name="name1" type="text" size="30" onblur="sendRequest(1,this.form.name1.value)">
    32. </span>
    35. <div id="content0">
    36. </div>
    38. <div id="content1">
    39. </div>
    42. </form>
    43. </body>/
    Alles anzeigen


    suggest.js

    Quellcode

    1. var resObjekt = null;
    2. function erzXMLHttpRequestObject()
    3. {
    4. if (window.ActiveXObject) {
    5. try {
    6. // IE 6 and higher
    7. resObjekt = new ActiveXObject("MSXML2.XMLHTTP");
    8. } catch (e) {
    9. try {
    10. // IE 5
    11. resObjekt = new ActiveXObject("Microsoft.XMLHTTP");
    12. } catch (e) {
    13. resObjekt=false;
    14. }
    15. }
    16. }
    17. else if (window.XMLHttpRequest) {
    18. try {
    19. // Mozilla, Opera, Safari ...
    20. resObjekt = new XMLHttpRequest();
    21. } catch (e) {
    22. resObjekt=false;
    23. }
    24. }
    25. return resObjekt;
    26. }
    28. function sendRequest(digit,value) {
    29. resObjekt.onreadystatechange = handleResponse;
    30. var datum = new Date();
    31. resObjekt.open('get', 'suggest.php?s='+ digit+'&value='+value+'&tv=' + datum.getTime(), true);
    32. resObjekt.send(null);
    33. }
    35. function handleResponse() {
    36. if ((resObjekt.readyState == 4) && (resObjekt.status == 200)) {
    37. var update = new Array();
    38. var response = resObjekt.responseText;
    39. if(response.indexOf('||' != -1)) {
    40. update = response.split('||');
    41. for(i=0; i<update.length; i+=2){
    42. document.getElementById(update[i]).innerHTML = update[i+1];}
    43. }
    44. }
    45. }
    46. resObjekt=erzXMLHttpRequestObject();
    Alles anzeigen


    suggest.php

    Quellcode

    1. <?
    3. $htmlID = 'content';
    7. if($_GET['s'] == '1') {
    9. echo $htmlID."0".'||';
    10. echo $_GET[value]+50;
    11. echo '||';
    12. echo $htmlID."1".'||';
    13. echo $_GET[value]+150;
    14. echo '||';
    15. }
    17. ?>
    Alles anzeigen


    könnt ihr mir sagen, woran das liegt?

    vielen dank für eure hilfe
    gruß max

  • vielen dank für die schnelle antwort!

    bei der php-datei war es ein fehler bei copy&paste, es ist keine leerzeile vor dem anfangstag.

    hier noch einmal meine aktualisierte suggest.html:

    Quellcode

    1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    2. <html xmlns="http://www.w3.org/1999/xhtml">
    3. <head>
    4. <title>testdokument</title>
    5. <script type="text/javascript" src="suggest.js"></script>
    7. <style type="text/css">
    8. <!--
    9. div {
    10. float:left;
    11. width:25%;
    12. font-size:10px;
    13. background-color:#e5e5e5;
    14. margin:10px;
    15. height:200px;
    16. width:175px;
    17. }
    18. //-->
    19. </style>
    20. </head>
    21. <body>
    22. <br />
    23. <form name="f1" method="post" action="">
    24. <span id="name">
    25. Geben Sie den Nachnamen ein:<br />
    26. <input name="name1" type="text" size="30" onkeyup="sendRequest(1,this.form.name1.value)" />
    27. </span>
    30. <div id="content0">
    31. </div>
    33. <div id="content1">
    34. </div>
    37. </form>
    38. </body>
    39. </html>
    Alles anzeigen



    leider habe ich immer noch das problem, dass im ie nur bei der eingabe der ersten zahl der inhalt der divs geändert wird, leider aber nicht, wenn man die zahl ändert. habe das ereignis jetzt einmal von onblur auf onkeyup geändert, aber auch das geht nicht.

    ist dir zu meinem zweiten punkt etwas eingefallen, was ich machen kann damit firefox diesen fehler nicht mehr hat bzw. erscheint dieser in der statusleiste im ie auch.

    vielen dank noch einmal für die hilfe!

  • der document.getElementById(update) has no properties fehler erscheint, weil du hinter dem content noch ein abschließendes || hast. das brauchst du nicht

    die schleife sieht ja so aus:

    Quellcode

    1. update = response.split('||');
    2. for(i=0; i<update.length; i+=2){
    3. document.getElementById(update[i]).innerHTML = update[i+1];}


    beu ungerader anzahl von ||'s gibts also fehler

    aber der onkeyup handler sollte eigentlich bei jedem tastendruck innerhalb des input feldes aufgerufen werden. kannst ja mal ein alert() an oberster stelle einbauen.. sollte eigentlich funktionieren

  • schrittweise ranarbeiten
    wird die funktion aufgerufen?

    Quellcode

    1. function sendRequest(digit,value) {
    2. alert("sie haben "+value+" gedrueckt");
    3. resObjekt.onreadystatechange = handleResponse;
    4. var datum = new Date();
    5. resObjekt.open('get', 'suggest.php?s='+ digit+'&value='+value+'&tv=' + datum.getTime(), true);
    6. resObjekt.send(null);
    7. }


    fehler bei der ajax funktion?

    Quellcode

    1. function sendRequest(digit,value) {
    2. resObjekt.onreadystatechange = handleResponse;
    3. alert("sie haben "+value+" gedrueckt");
    4. var datum = new Date();
    5. resObjekt.open('get', 'suggest.php?s='+ digit+'&value='+value+'&tv=' + datum.getTime(), true);
    6. resObjekt.send(null);
    7. }


    fehler bei der datums funktion?

    Quellcode

    1. function sendRequest(digit,value) {
    2. resObjekt.onreadystatechange = handleResponse;
    3. var datum = new Date();
    4. alert("sie haben "+value+" gedrueckt");
    5. resObjekt.open('get', 'suggest.php?s='+ digit+'&value='+value+'&tv=' + datum.getTime(), true);
    6. resObjekt.send(null);
    7. }


    ...

  • super, das funktioniert jetzt.
    nur noch eine kleine frage, vielleicht kannst du mir da auch noch helfen:

    wenn ich im firefox die löschentaste verwende (nicht entfernen, sondern die über return), aktualisiert er mir die ausgabe, beim ie geht das aber leider nicht. hier muss ich eine andere zahl eingeben, um die ausgabe zu aktualisieren

  • ist ganz einfach..
    um der restriktion auf 265 Zeichen bei GET aus dem weg zu gehen gehe folgendermaßen vor:

    aus GET mache POST...

    Quellcode

    1. resObjekt.open('get', 'suggest.php?s='+ digit+'&value='+value+'&tv=' + datum.getTime(), true);
    2. resObjekt.send(null);


    Quellcode

    1. resObjekt.open('post', 'suggest.php');
    2. resObjekt.send('s='+ digit+'&value='+value+'&tv=' + datum.getTime()');


    in der PHP Datei dann statt über $_GET über $_POST zugreifen

  • ich noch einmal.

    habe jetzt ein bisschen umgestellt und noch eine zeile hinzugefügt, jetzt funktioniert es auch mit post:

    Quellcode

    1. req.open('POST', 'berechnungen/stammdaten.php',true);
    2. req.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
    3. req.onreadystatechange = handleResponse;
    4. req.send('e1='+e1);


    mal schauen wie weit ich jetzt komme :D