login  Naam:   Wachtwoord: 
Registreer je!
 Forum

[AJAX] Oude waarde terug in IE? ff werkt prima

Offline Mad_Mike - 04/09/2006 17:23 (laatste wijziging 04/09/2006 17:24)
Avatar van Mad_MikePHP beginner Hoi allemaal.
Ik zit met het volgende probleem. Mijn code werkt prima onder FF, maar onder IE krijg ik bijna altijd oude waarden terug 


index.php
  1. <script>
  2. function createRequestObject() {
  3. var req;
  4. if(window.XMLHttpRequest){
  5. req = new XMLHttpRequest();
  6. } else if(window.ActiveXObject) {
  7. req = new ActiveXObject("Microsoft.XMLHTTP");
  8. } else {
  9. req = NULL;
  10. alert('Probleem met het aanmaken van hetXMLHttpRequest object');
  11. }
  12. return req;
  13. }
  14.  
  15. var http = createRequestObject();
  16.  
  17. function sendRequest(type) {
  18. var d = new Date();
  19. var randomU = d.getFullYear()+(d.getMonth()+1)+d.getDate()+d.getHours()+d.getMinutes()+d.getSeconds()
  20.  
  21. if(type == "gamers") {
  22. var url = 'server.php?type=gamers&random='+randomU;
  23. }
  24.  
  25. http.open('get', url);
  26. http.onreadystatechange = handleResponse;
  27. http.send(null);
  28.  
  29. function handleResponse() {
  30. if(http.readyState == 4) {
  31. if(type == "gamers") {
  32. document.getElementById('gamers').innerHTML = http.responseText;
  33. }
  34. }
  35. }
  36. }
  37.  
  38. function updateGamers() {
  39. sendRequest("gamers");
  40. gamersTimer = setTimeout('updateGamers()', 2000);
  41. }
  42. </script>
  43. <table width="500" border="1" align="center" cellpadding="2" cellspacing="0" bordercolor="#000000" bgcolor="#CCCCCC" style="border-collapse:collapse; ">
  44. <tr align="left" valign="top">
  45. <td colspan="2">welkom - <? echo $_SESSION['gamerName']; ?></td>
  46. <td width="80" align="right"><a href="?page=logout">logout</a></td>
  47. </tr>
  48. <tr align="left" valign="top">
  49. <td width="120" height="150">Overzicht gamers:<br />
  50. <div id="gamers" style="width:120px; height:100%; overflow:auto;">
  51.  
  52. </div></td>
  53. <td width="288">&nbsp;</td>
  54. <td>&nbsp;</td>
  55. </tr>
  56. <tr align="center" valign="top">
  57. <td colspan="3">Copyright &copy; 2006 Mad_Mike</td>
  58. </tr>
  59. </table>
  60. <script>
  61. updateGamers();
  62. </script>



server.php
  1. <?
  2. $query = mysql_query("SELECT * FROM gamers ORDER BY gamerName") or die(mysql_error());
  3. while($select = mysql_fetch_array($query)) {
  4. $gamerID = $select['gamerID'];
  5. $gamerName = $select['gamerName'];
  6.  
  7. echo $gamerName."<br />";
  8. } ?>



voorbeeld is te vinden op: http://www.djmadmike.nl/games/

8 antwoorden

Gesponsorde links
Offline haytjes - 04/09/2006 18:10
Avatar van haytjes Gouden medailleGouden medaille

JS gevorderde
Dit lijkt wel te werken in Internet Explorer. Bij mij toch.
Offline Mad_Mike - 04/09/2006 18:14 (laatste wijziging 05/09/2006 22:20)
Avatar van Mad_Mike PHP beginner Dat idee had ik net ook weer toen ik een tijd ernaar keek. Maar speel maar een beetje met in en uitloggen en bijde browsers open. Op een gegeven moment gaat ie vaag doen.

[edit]
Het probleem met het verkrijgen van oude data is verholpen!! IE heeft een unieke url nodig die naar de server gestuurd wordt. Ik plak nu met Math.random() een uniek cijfer achter de url en dat werkt prima 

Maar nu het volgende:
  1. <script>
  2. function update1() {
  3. document.getElementById("aa").innerHTML += ".";
  4. timer1 = setTimeout("update1()", 500);
  5. }
  6.  
  7. function update2() {
  8. document.getElementById("bb").innerHTML += ".";
  9. timer2 = setTimeout("update2()", 500);
  10. }
  11. </script>
  12. <div id="aa">&nbsp;</div>
  13. <div id="bb">&nbsp;</div>
  14. <script>
  15. update1();
  16. update2();
  17. </script>


Dit werkt prima. Heb 2 timers lopen die 'tegelijk' ieder een bepaalde div in de pagina updaten. Maar als ik dat stukje in mijn ander code verwerk. Krijg ik in FF alleen de gamers geupdate, en status update werkt niet (zou steeds een . erbij moeten komen) En in IE loopt de status vrolijk vol met puntjes... en op een gegeven moment komen de gamers er pas bij. Zit er nog een soort van timing probleem met ajax ofzo?
Laat ik OF update gamers OF update status uit. Wekt het prima

Hier is de up to date code:
  1. <script>
  2. function createRequestObject() {
  3. var req;
  4. if(window.XMLHttpRequest){
  5. req = new XMLHttpRequest();
  6. } else if(window.ActiveXObject) {
  7. req = new ActiveXObject("Microsoft.XMLHTTP");
  8. } else {
  9. req = NULL;
  10. alert('Probleem met het aanmaken van hetXMLHttpRequest object');
  11. }
  12. return req;
  13. }
  14.  
  15. var http = createRequestObject();
  16.  
  17. function sendRequest(type, value) {
  18. var randomU = Math.random(99999);
  19.  
  20. if(type == "gamers") {
  21. var url = 'server.php?type=gamers&random='+randomU;
  22. } else if(type == "uitdagen") {
  23. var url = 'server.php?type=uitdagen&ontvanger='+value+'&random='+randomU;
  24. } else if(type == "status") {
  25. var url = 'server.php?type=status&random='+randomU;
  26. }
  27.  
  28. http.open('get', url);
  29. http.onreadystatechange = handleResponse;
  30. http.send(null);
  31.  
  32. function handleResponse() {
  33. if(http.readyState == 4) {
  34. if(type == "gamers") {
  35. document.getElementById('gamers').innerHTML = http.responseText;
  36. } else if(type == "uitdagen") {
  37. document.getElementById('status').innerHTML = http.responseText;
  38. } else if(type == "status") {
  39. document.getElementById('status').innerHTML += http.responseText;
  40. }
  41. }
  42. }
  43. }
  44.  
  45. function updateGamers() {
  46. sendRequest("gamers");
  47. gamersTimer = setTimeout('updateGamers()', 1000);
  48. }
  49.  
  50. function updateStatus() {
  51. sendRequest("status");
  52. statusTimer = setTimeout('updateStatus()', 1000);
  53. }
  54.  
  55. function daaguit(userID) {
  56. sendRequest("uitdagen", userID);
  57. }
  58. </script>
  59. <table width="500" border="1" align="center" cellpadding="2" cellspacing="0" bordercolor="#000000" bgcolor="#CCCCCC" style="border-collapse:collapse; ">
  60. <tr align="left" valign="top">
  61. <td colspan="2">welkom - <? echo $_SESSION['gamerName']; ?></td>
  62. <td width="80" align="right"><a href="?page=logout">logout</a></td>
  63. </tr>
  64. <tr align="left" valign="top">
  65. <td height="20" colspan="3" id="status"></td>
  66. </tr>
  67. <tr align="left" valign="top">
  68. <td width="120" height="150">Overzicht gamers:<br />
  69. <div id="gamers" style="width:120px; height:100%; overflow:auto;">
  70.  
  71. </div></td>
  72. <td width="288">&nbsp;</td>
  73. <td>&nbsp;</td>
  74. </tr>
  75. <tr align="center" valign="top">
  76. <td colspan="3">Copyright &copy; 2006 Mad_Mike</td>
  77. </tr>
  78. </table>
  79. <script>
  80. updateGamers();
  81. updateStatus();
  82. </script>
Offline haytjes - 05/09/2006 22:46
Avatar van haytjes Gouden medailleGouden medaille

JS gevorderde
  1. function sendRequest(type, value) {
  2. var randomU = Math.random(99999);
  3. var http = createRequestObject();
  4. if(type == "gamers") {
  5. var url = 'server.php?type=gamers&random='+randomU;
  6. } else if(type == "uitdagen") {
  7. var url = 'server.php?type=uitdagen&ontvanger='+value+'&random='+randomU;
  8. } else if(type == "status") {
  9. var url = 'server.php?type=status&random='+randomU;
  10. }
  11.  
  12. http.open('get', "http://www.djmadmike.nl/games/"+url);
  13. http.onreadystatechange = handleResponse;
  14. http.send(null);
  15.  
  16. function handleResponse() {
  17. if(http.readyState == 4) {
  18. if(type == "gamers") {
  19. document.getElementById('gamers').innerHTML = http.responseText;
  20. } else if(type == "uitdagen") {
  21. document.getElementById('status').innerHTML = http.responseText;
  22. } else if(type == "status") {
  23. document.getElementById('status').innerHTML += http.responseText;
  24. }
  25. }
  26. }
  27. }


lost deze functie het probleem op?
Offline Mad_Mike - 05/09/2006 22:54
Avatar van Mad_Mike PHP beginner :cool: Yes... it works fine!!

Kheb alleen http.open('get', "http://www.djmadmike.nl/games/"+url); wel weer veranderd naar http.open('get', url);

Het zat 'm dus in steeds een nieuwe instantie aanmaken van het requestobject. Nu is mijn vraag wel, is dit niet 'onndig' ?:$

Ben blij dat het werkt. Maar is het niet het idee van objecten dat je deze 1x aanmaakt en daarna kunt 'hergebruiken'??
Offline haytjes - 05/09/2006 22:59 (laatste wijziging 05/09/2006 23:00)
Avatar van haytjes Gouden medailleGouden medaille

JS gevorderde
oké, goed dat het werkt, kan nu mijn uitleg ook geven en ook een tip, want dit is idd niet een al te goeie oplossing.

Dus die var "http" is dus een object die op het internet achter een site gaat. Terwijl dat object nog bezig is met op het internet te zoeken. Zet je dat hij een andere site moet gaan bezoeken. Hier zit dan ook het probleem. De site is nog niet geladen als je het object vraagt om een andere site te gaan halen.

Nu heb ik dit opgelost met elke keer een nieuwe "http"-object aan te maken (dit is slecht). Hiervan zou ik oftewel drie objecten van maken (voor elke request die je om de 1 seconde doet) oftewel een http-manager maakt. Die slaat dan op welke urls er nog bezocht moeten worden en bezoekt ze één voor één (nadat de vorige is ingeladen).

Heb je hier nog vragen over, vuur je ze maar af.
Offline Mad_Mike - 05/09/2006 23:06
Avatar van Mad_Mike PHP beginner Ik laat het voorlopig nog even zo. Het is idd zoals we alle 2 zeggen niet de meest nette oplossing. Maar zo kan ik voorlopig wel verder gaan knutselen hiermee 
Uiteindelijk zijn er een aantal opties om dit netjes af te handelen:
1. Per update functie een eigen http object (+ evt manager)
2. Een 'http-object' pool. Oftewel. Zorg dat er voldoende (niet TE veel) http objecten beschikbaar zijn en 'deel' deze uit aan de functie die ze nodig heeft.
3. Maak 1 http-object manager die 1 of meerdere http-objecten heeft en die zorgt voor een nette afhandeling (evt met priority en een wachtrij).

Wat is jou kijk hierop?
Offline haytjes - 05/09/2006 23:26 (laatste wijziging 05/09/2006 23:27)
Avatar van haytjes Gouden medailleGouden medaille

JS gevorderde
De eerste oplossing is het gemakkelijkst, maar het minst mooi. De tweede oplossing is het moeilijkst en zou ik niet doen. (Wat als je te weinig http-objecten hebt). Dus blijft de laatste alleen over.

Ik kies dit omdat de data die je hierdoor verkrijgt niet dringend is. De data moet gewoon up2date zijn, maar als er een happering van een paar seconden inzit is het geen probleem. Hiervoor zou ik alleen een wachtrij maken. (priority is overbodig denk ik)

  1. //aangezien je toch redelijk wat kan scripten, zal ik het niet helemaal zelf schrijven.
  2.  
  3. var http = createRequestObject();
  4. var wachtlijst = Array();
  5. var status = "idle";
  6.  
  7. function sendrequest(url)
  8. {
  9. wachtlijst[wachtlijst.length] = url;
  10. manager();
  11. }
  12. function manager()
  13. {
  14. if(status == "idle" && wachtlijst.length != 0)
  15. {
  16. //kom in actie
  17. status = "busy";
  18.  
  19. http.open('get', wachtlijst.shift());
  20. http.onreadystatechange = handleResponse;
  21. http.send(null);
  22. function handleResponse() {
  23. if(http.readyState == 4) {
  24. //doe iets met de data
  25.  
  26. //zetten dat hij klaar is => volgende beginnen.
  27. status = "idle";
  28. manager();
  29. }
  30. }
  31. }
  32. }
Offline Mad_Mike - 05/09/2006 23:35
Avatar van Mad_Mike PHP beginner Ja dat programmeren lukt me wel.
Opzich is die 2e oplossing wel de meest nette oplossing in mijn ogen. Je moet het systeem dan zo slim maken dat het altijd een aantal http-objecten over houdt. Heeft ie er op een gegeven moment teveel, verwijderd ie er een aantal. Zijn er tekort, maakt hij nieuwe bij.

Dit zie je veel in de wat groteren software projecten. Heb het zelf ooit gebruikt in een asp.NET webapp waarbij artsen in een ziekenhuis patientdata kunnen opvragen. Dit ging soms door zoveel artsen tegelijk, dat de server het moeilijk had door de vele requests. Dan is een pool erg handig en nuttig. Je kan die objecten dan ook een verloopdatum meegeven, zodat je patientobject wel uptodate is 
Dit zal echter voor deze eenvoudige site niet nodig zijn.
Gesponsorde links
Dit onderwerp is gesloten.
Actieve forumberichten
© 2002-2024 Sitemasters.be - Regels - Laadtijd: 0.228s