views:

311

answers:

4

I have a facebook like system, I want the DIV containing the messages to automatically update when a new message is posted. Is this possible? If so, how would i go about doing this?

<?php include('config.php'); ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"&gt;
<html>
    <head>
        <title>Alpha</title>
        <link rel="stylesheet" href="style.css" type="text/css" />  
    </head>
    <body>

<?php 

// Logged IN
if(!empty($_SESSION['LoggedIn']) && !empty($_SESSION['Email'])) {


// Post to Database
if(!empty($_POST['message']))
{
$message = mysql_real_escape_string($_POST['message']);
$postmessage = mysql_query("INSERT INTO Wall (Message, UserID) VALUES('".$message."', '".$_SESSION['UserID']."')");
}

// Collet Latest Posts

$query = "
    SELECT Users.UserID, Wall.Message, Users.Forename, Users.Surname 
    FROM Wall
    INNER JOIN Users ON Wall.UserID = Users.UserID
    ORDER BY Wall.MessageID DESC
    LIMIT 20;";
$result = mysql_query($query) or die('Invalid query: ' . mysql_error());

// Collet Post User
    ?>
    <div id ="container">
        <div id="insideleft">
            <ul>
                <li><a href="index.php">Home</a></li>
                <li><a href="profile.php">Edit Profile</a></li>
                <li><a href="wall.php">Community Wall</a></li>
                <li><a href="logout.php">Logout</a></li>
            </ul>
        </div>
        <div id="insideright">
            <h1>Community Wall</h1>
            <br />
            <div id="postcontainer">
                <form method="post" action="wall.php" name="wallpost" id="wallpost">
                    <input type="text" name="message" id="message" class="message" />
                    <input type="submit" name="messagesub" id="messagesub" value="Post Message" class="post"/><br /><br />
                 </fieldset>
                </form>
            </div>
            <?php while ($row = mysql_fetch_assoc($result)) { ?>
            <div id="messagecontainer">
            <p class="messageposter">
            <?php echo "<b>{$row['Forename']} {$row['Surname']}</b><br />"; ?>
            </p>
            <p class="message">
            <?php echo stripslashes($row['Message']); ?>
            </p>
            </div>

<?php
} ?>

        </div>
    </div>
    <?php
}

else {echo "<meta http-equiv='refresh' content='0;index.php'>";}

?>
</body>
</html>
+1  A: 

make an ajax call to request for updated data. wrap it in a function that recursively calls itself using setTimeOut(). Basically same principle as making a javascript clock (lookup tuts for that) except you use ajax to get current data instead of displaying time.

Crayon Violent
+1  A: 

you can use one of the techniques that are known as Comet

Or you could use XMPP over BOSH
See also http://xmpp.org/extensions/xep-0124.html and http://xmpp.org/extensions/xep-0206.html

davyM
A: 

Ajax is a client-based stateless system:
the client must contact the server,it can't be the server contacting the user but you can create a simple ajax function that check a page every X seconds if there are news.

if you want you can reduce the amount of ajax request you can hold the page for example for 5 seconds checking it 10 times and sleeping 0.5s each time it fails to get news.

Plokko
A: 

XMPP over Bosh is the best solution here if your application really need real-time-update (Real time in the real sense). Jaxl library provides integrated support for XMPP over Bosh, you might want to try this for your application http://github.com/abhinavsingh/JAXL

Abhinav Singh