phpSensei Posted March 2, 2008 Share Posted March 2, 2008 I just created an Ajax Chat box and realized the information doesnt update without refreshing the page. What i mean is, you enter a message, and all and without the page refreshing, Ajax Shows You Your message in the chat box. But if another user from somewhere else is in the chat, what you just entered doesnt show for them unless they refresh or post a message. Anyway how do you go about doing this? I do not ask for you to write the code, but some hints or tips would be very much appreciated. Thankyou. btw, I looked at tutorial and it beats me how it works. Quote Link to comment Share on other sites More sharing options...
phpSensei Posted March 2, 2008 Author Share Posted March 2, 2008 if your interessted in the code <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>ChatNow :: Version 1.0 usr</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <style type="text/css"> <!-- body { background-color: #333333; } .fld { font-family: Arial, Helvetica, sans-serif; font-size: 12px; color: #CCCCCC; background-color: #3F3F3F; border: 1px solid #282828; } .style1 { font-size: 12px; font-family: Arial, Helvetica, sans-serif; color: #999999; } --> </style> <style type="text/css"> <!-- .style6 {font-size: 16px; font-family: Arial, Helvetica, sans-serif; } .style8 {font-size: 14px; font-family: Verdana, Arial, Helvetica, sans-serif; } --> </style> <script type="text/javascript" language="javascript"> // Focus on message field function ObjectMaker(){ var XMLHttpRequestObject = false; if(window.XMLHttpRequest){ var XMLHttpRequestObject = new XMLHttpRequest(); } else if(window.ActiveXObject){ var XMLHttpRequestObject = new ActiveXObject("Microsoft.XMLHTTP"); } else { alert("Please Enable Javascript"); } return XMLHttpRequestObject; } // Intiate the object var Obj = ObjectMaker(); function PostMessage(){ var message = document.getElementById('msg').value; var name = document.getElementById('name').value; Obj.open('post','messages2.php'); Obj.setRequestHeader('Content-Type','application/x-www-form-urlencoded'); Obj.onreadystatechange = HandleGet; Obj.send('message=' + message + "&name=" + name); document.getElementById('msg').value = ''; document.boxForm.msg.focus(); objDiv = document.getElementById('messages'); objDiv.scrollTop = objDiv.scrollHeight; } function HandleGet(){ if(Obj.readyState == 4 && Obj.status == 200){ var response = Obj.responseText; if(response){ document.getElementById('messages').innerHTML = response; } } } </script> </head> <body onload="PostMessage();"> <table width="49%" border="0" align="center" cellpadding="0" cellspacing="2" bgcolor="#282828"> <tr> <td align="center" bgcolor="#4B4B4B" class="style1">ChatNow :: Version 1.0</td> </tr> <tr> <td height="310" valign="top" bgcolor="#414141"><table width="100%" border="0" align="center" cellpadding="0" cellspacing="5"> <tr> <td><div id="messages" style="overflow:scroll;height:300px;width:40em;"></div></td> </tr> </table></td> </tr> <tr> <td height="61" align="center" bgcolor="#666666"><table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <td height="251" align="center" bgcolor="#4B4B4B"><form name="boxForm"> <table width="100%" border="0" cellspacing="3" cellpadding="0"> <tr> <td align="left"><span class="style1"> Message: </span></td> </tr> <tr> <td align="center"><textarea name="msg" cols="100" rows="10" class="fld" id="msg"></textarea> </td> </tr> <tr> <td align="center"><input name="button" onclick="PostMessage();" type="button" class="fld" value="Insert Message" /> <input type="hidden" name="name" value="<?php echo $_SERVER['REMOTE_ADDR']; ?>" /></td> </tr> </table> </form></td> </tr> </table></td> </tr> </table> </body> </html> Quote Link to comment Share on other sites More sharing options...
phpSensei Posted March 5, 2008 Author Share Posted March 5, 2008 nvm, cache control Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.