Tealk: Automatische Aktuallisierung eines Div's

Also ich schreibe gerade eine Seite auf der ich eine Art "chat" ausgeben möchte, diese wird mir per json übergeben und die habe ich auch schon soweit umgebaut dass ich sie einbinden kann, nun habe ich aber das Problem dass ich die Seite immer neu laden müsste wenn ich die neusten Einträge sehen möchte, aber ich würde gerne nur den Div in welchem der Chat sich befindet neu laden und nicht die ganze Seite.

Hier noch der Code:

  
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">  
<html xmlns="http://www.w3.org/1999/xhtml"><head>  
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />  
<link type="text/css" rel="stylesheet" media="screen" href="chat.css" />  
  
<title>Multiplayer-Leidenschaften Pen&Paper</title>  
</head>  
<body>  
<div class="body">  
    <div class="textarea"><div class="textareatext">  
    	<div id="refreshing">  
        <table width="100%" border="0" cellspacing="0" cellpadding="0">  
          <tr>  
            <td><table id= "chatdaten" width="100%" border="0" cellspacing="0" cellpadding="0">  
              <tr>  
                <td width="150">Nickname</td>  
                <td>Chat</td>  
              </tr>  
              <tr>  
                 <?  
                $url = 'http://78.47.47.178:8080/wuerfelserver/Web';  
                $content = file_get_contents($url);  
                $json = json_decode($content, true);  
  
                foreach($json['Chat'] as $item) {  
                    print '<tr>';  
                    print '<td valign="top">';  
                    print $item['nick'];  
                    print '</td>';  
                    print '<td class="borderbottom">';  
                    print $item['nachricht'];  
                    print '</td>';  
                    print '</tr>';  
                }  
                ?>  
              </tr>  
            </table></td>  
          </tr>  
          </table>  
        </div>  
    </div></div>  
</div>  
</body>  
</html>  

  1. hi,

    nun - du kannst den php- anteil in deinem code in eine eigene Datei.php auslagern.

    die lädst du dann in einem intervall mit AJAX in deine seite.
    für ajax gibts 1000 beispiele im web - kuckst du

    und dann einfach mit
    $('#deindiv').html( data ); //oder ähnlich

    Viele Grüße aus LA

    --
    ralphi
    1. nun - du kannst den php- anteil in deinem code in eine eigene Datei.php auslagern.

      das hab ich schon mal probiert aber aus irgend einem grund hatte ich dann keine ausgabe mehr von meinem json

      1. das hab ich schon mal probiert aber aus irgend einem grund hatte ich dann keine ausgabe mehr von meinem json

        Dann hast du wahrscheinlich irgendetwas falsch gemacht.

        Es gibt afaik nur 3 Möglichkeiten, 1. Seite neu laden - was du nicht möchtest, 2. AJAX - wird von so ziemlich jedem Browser heutzutage unterstützt und 3. Websockets was wahrscheinlich am besten passt, und von aktuellen Browsern auch unterstützt wird.

        Da dir wahrscheinlich die Erfahrung fehlt, würde ich AJAX als erstes empfehlen, da das mehr Anwendungsgebiete hat, sprich du solltest es sowieso lernen.

        Websockets setzen auch Serverseitiges voraus, was bei "normalen" Hosting-Packeten meist nicht gegeben ist, wo dann AJAX  (long polling) wieder als Fallback verwendet wird.

        MfG
        bubble

        --
        If "god" had intended us to drink beer, he would have given us stomachs. - David Daye
        1. Websockets setzen auch Serverseitiges voraus, was bei "normalen" Hosting-Packeten meist nicht gegeben ist, wo dann AJAX  (long polling) wieder als Fallback verwendet wird.

          Naja dafür habe ich ja meinen Rootserver :P

          naja dann muss ich mich da nochmal durchwurschteln

            
          <script type="text/javascript">  
          function reloadDiv() {  
          	$('#refreshing').load('chat.php');  
          }  
          etInterval("reloadDiv()", 1000); // 60 * 1000 * 10  
          </script>  
          
          

          ich hatte mal den schnipsel aus dem internet genommeb aber der wollte nicht so recht

          1. hmm ok habs hinbekommen hab nen anderen code benutzt

              
            <script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>  
            <script type="text/javascript">  
            $(document).ready(function() {  
            	setInterval(function() {  
            		$('#chatcontent').load('chat.php')  
            	},1000);  
            });  
            </script>  
            
            

            ne Kleinigkeit fehlt mir allerdings noch, der scrollt nicht automatisch mit -.-

            1. hi

              ne Kleinigkeit fehlt mir allerdings noch, der scrollt nicht automatisch mit -.-

              ich benutze meistens GET mit AJAX
              Bsp rauskopiert:

              $.get("demo.php",function(data,status){  
                  $("#test2").html(data);  
                  //alert("Data: " + data + "\nStatus: " + status);  
                });
              

              da verutscht mir so weit ich mich errinnere eigentlich nix

              Viele Grüße aus LA

              --
              ralphi