Shoutbox help!

  • TheDayIsMine
  • Novice
  • Novice
  • TheDayIsMine
  • Posts: 22

Post 3+ Months Ago

Hello everyone, I followed THIS (click) tutorial on creating shoutbox's. After uploading the stuff, I added some css to make it look a bit prettier, and I need help with a few things regarding php and javascript- (I'm not very php / javascript smart).

I want the page to refresh every 3-5 seconds, so I tried the
Code: [ Select ]
<meta http-equiv="refresh" content="5">

but I don't want whatever the person was typing in the 'message' section to disappear on refresh. I just want the table td holding the already posted shouts to refresh but not the actual form


This is the shout section php code:
Code: [ Select ]
<?php
 
// calling session_start() the function which starts our authentication session
session_start();
 
// connecting to mysql server
$l = mysql_connect  ( "localhost" , "admin" , "shoutbox" ) or die("Error connecting:<BR><BR>".mysql_error());
mysql_select_db( "evergre7_shoutbox" ) or die("Error getting db:<BR><BR>".mysql_error());
 
// defining getShouts() which is our function that gets all of our shouts
function getShouts()
{
 
    echo '<div align="center">
        <table width="150" cellspacing="3px" cellpadding="0" class="table">
          <tr>
            <td class="formb">
    '; 
   
    $query = mysql_query("SELECT * FROM shouts ORDER BY id DESC LIMIT 10") or die(mysql_error());
    while ($row = mysql_fetch_array($query) )
    {
       
        $name = stripslashes($row['Name']);
        $contact = stripslashes($row['Contact']);
        $shout = stripslashes($row['Shout']);
       
        if(empty($contact))
        {
       
            echo '<p><span class="author">'.$name.'</span> <span class="dash">|</span> <span class="shout">'.$shout.'</span></p>';
           
        } else {
       
            echo '<p><span class="author"><a href="'.$contact.'" target="_blank">'.$name.'</a></span> - <span class="shout">'.$shout.'</span></p>';
 
        } // if empty contact
               
    } // while row mysqlfetcharray query
   
    echo '<br><br>';
   
    echo '
            </td>
          </tr>
 
        '; 
 
} // function getshouts
 
 
// our processing if control statement
if ( isset ( $_POST['shout'] ) )
{
   
    $name = addslashes($_POST['name']);
    $message =  $_POST['message'];
   
    if ( ( isset($name) ) && ( isset($message) ) )
    {
       
        // getting smilie list
        $smilies = mysql_query("SELECT * FROM smilies") or die(mysql_error());
        while($get = mysql_fetch_array ($smilies))
        {
           
            $alt = $get['Alt'];
            $smilie = $get['URL'];
           
            $message = str_replace( $get['Symbol'] , '<img src="smilies/'.$smilie.'" border="0" width="15" height="15" alt="'.$alt.'">' , $message);
            $themessage = addslashes($message);
           
            // replacing all smilies
                   
        }
   
        mysql_query("INSERT INTO shouts (Name, Contact, Shout) VALUES ( '$name' , '$contact' , '$message' )") or die(mysql_error());
        $_SESSION['has_posted'] = 'yes';
       
        setcookie('dataCookie', $name, time()+(60*60*24*365));
        header("Location: shout.php");
       
        // if required fields aren't empty, process into database
       
    } else {
   
        echo '<script>alert("Some fields were not filled out!");</script>';
        header("Location: shout.php");
       
        // if required fields were left empty, show an error dialog
       
    }
 
}/* else {
 
    echo '<script>alert("Please follow the form to this page.");</script>';
    header("Location: shout.php");
   
    // if they weren't even referred from the form, show error dialog and redirect
 
} // if isset post shout
 
/* STARTING THE MAIN SCRIPT NOW */
 
// starting the table
 
//displaying the shouts
getShouts();
 
 
mysql_close($l);
 
$userCookie = $_COOKIE['dataCookie'];
if ($userCookie == '') { $userCookie = 'Anonymous'; }
 
?>
 
            <div align="center">
            <form name="shout" method="post" action="shout.php" class="form">
                <tr><td class="formb">
                    <span class="headers">name:</span> <br><input name="name" type="text" id="name" size="25" maxlength="10" onfocus="this.select()" onblur="this.value=!this.value?'Anonymous:':this.value;" value="<?= $userCookie?>" class="input"><br>
                </tr></td><tr><td class="formb">
                    <span class="headers">Message:</span> <br><input name="message" type="text" id="message" size="25" class="input"><br>
                </tr></td><tr><td class="formb">
                    <input name="shout" type="submit" id="shout" value="Post!" class="submit">
                </tr></td>
              </div>
            </form>
           
         
          </table>
          </div>
 
<div class="footer">
<a href="emotes.htm" target="page" onClick="window.open('','page','toolbar=0,scrollbars=1,location=0,statusbar=0,menubar=0,resizable=0,width=350,height=410,left=50,top=50,titlebar=yes')">
Show Emotes</a> |
 
 
 
</div>
 
<link href="shoutbox.css" rel="stylesheet" type="text/css">
 
<body>
 
<script type="text/javascript">
window.onload = function () {
        // focus on the input field for easy access...
        var input = document.getElementById ('message');
        input.focus ();
        // ...but if someone wishes to go back in their history, let them!
        document.onkeydown = function (e) {
            if (!e) {
                var e = window.event;
            }
            if (e.keyCode === 8 && !input.value) {
                history.back();
            }
        };
    };
 
</script>
  1. <?php
  2.  
  3. // calling session_start() the function which starts our authentication session
  4. session_start();
  5.  
  6. // connecting to mysql server
  7. $l = mysql_connect  ( "localhost" , "admin" , "shoutbox" ) or die("Error connecting:<BR><BR>".mysql_error());
  8. mysql_select_db( "evergre7_shoutbox" ) or die("Error getting db:<BR><BR>".mysql_error());
  9.  
  10. // defining getShouts() which is our function that gets all of our shouts
  11. function getShouts()
  12. {
  13.  
  14.     echo '<div align="center">
  15.         <table width="150" cellspacing="3px" cellpadding="0" class="table">
  16.           <tr>
  17.             <td class="formb">
  18.     '; 
  19.    
  20.     $query = mysql_query("SELECT * FROM shouts ORDER BY id DESC LIMIT 10") or die(mysql_error());
  21.     while ($row = mysql_fetch_array($query) )
  22.     {
  23.        
  24.         $name = stripslashes($row['Name']);
  25.         $contact = stripslashes($row['Contact']);
  26.         $shout = stripslashes($row['Shout']);
  27.        
  28.         if(empty($contact))
  29.         {
  30.        
  31.             echo '<p><span class="author">'.$name.'</span> <span class="dash">|</span> <span class="shout">'.$shout.'</span></p>';
  32.            
  33.         } else {
  34.        
  35.             echo '<p><span class="author"><a href="'.$contact.'" target="_blank">'.$name.'</a></span> - <span class="shout">'.$shout.'</span></p>';
  36.  
  37.         } // if empty contact
  38.                
  39.     } // while row mysqlfetcharray query
  40.    
  41.     echo '<br><br>';
  42.    
  43.     echo '
  44.             </td>
  45.           </tr>
  46.  
  47.         '; 
  48.  
  49. } // function getshouts
  50.  
  51.  
  52. // our processing if control statement
  53. if ( isset ( $_POST['shout'] ) )
  54. {
  55.    
  56.     $name = addslashes($_POST['name']);
  57.     $message =  $_POST['message'];
  58.    
  59.     if ( ( isset($name) ) && ( isset($message) ) )
  60.     {
  61.        
  62.         // getting smilie list
  63.         $smilies = mysql_query("SELECT * FROM smilies") or die(mysql_error());
  64.         while($get = mysql_fetch_array ($smilies))
  65.         {
  66.            
  67.             $alt = $get['Alt'];
  68.             $smilie = $get['URL'];
  69.            
  70.             $message = str_replace( $get['Symbol'] , '<img src="smilies/'.$smilie.'" border="0" width="15" height="15" alt="'.$alt.'">' , $message);
  71.             $themessage = addslashes($message);
  72.            
  73.             // replacing all smilies
  74.                    
  75.         }
  76.    
  77.         mysql_query("INSERT INTO shouts (Name, Contact, Shout) VALUES ( '$name' , '$contact' , '$message' )") or die(mysql_error());
  78.         $_SESSION['has_posted'] = 'yes';
  79.        
  80.         setcookie('dataCookie', $name, time()+(60*60*24*365));
  81.         header("Location: shout.php");
  82.        
  83.         // if required fields aren't empty, process into database
  84.        
  85.     } else {
  86.    
  87.         echo '<script>alert("Some fields were not filled out!");</script>';
  88.         header("Location: shout.php");
  89.        
  90.         // if required fields were left empty, show an error dialog
  91.        
  92.     }
  93.  
  94. }/* else {
  95.  
  96.     echo '<script>alert("Please follow the form to this page.");</script>';
  97.     header("Location: shout.php");
  98.    
  99.     // if they weren't even referred from the form, show error dialog and redirect
  100.  
  101. } // if isset post shout
  102.  
  103. /* STARTING THE MAIN SCRIPT NOW */
  104.  
  105. // starting the table
  106.  
  107. //displaying the shouts
  108. getShouts();
  109.  
  110.  
  111. mysql_close($l);
  112.  
  113. $userCookie = $_COOKIE['dataCookie'];
  114. if ($userCookie == '') { $userCookie = 'Anonymous'; }
  115.  
  116. ?>
  117.  
  118.             <div align="center">
  119.             <form name="shout" method="post" action="shout.php" class="form">
  120.                 <tr><td class="formb">
  121.                     <span class="headers">name:</span> <br><input name="name" type="text" id="name" size="25" maxlength="10" onfocus="this.select()" onblur="this.value=!this.value?'Anonymous:':this.value;" value="<?= $userCookie?>" class="input"><br>
  122.                 </tr></td><tr><td class="formb">
  123.                     <span class="headers">Message:</span> <br><input name="message" type="text" id="message" size="25" class="input"><br>
  124.                 </tr></td><tr><td class="formb">
  125.                     <input name="shout" type="submit" id="shout" value="Post!" class="submit">
  126.                 </tr></td>
  127.               </div>
  128.             </form>
  129.            
  130.          
  131.           </table>
  132.           </div>
  133.  
  134. <div class="footer">
  135. <a href="emotes.htm" target="page" onClick="window.open('','page','toolbar=0,scrollbars=1,location=0,statusbar=0,menubar=0,resizable=0,width=350,height=410,left=50,top=50,titlebar=yes')">
  136. Show Emotes</a> |
  137.  
  138.  
  139.  
  140. </div>
  141.  
  142. <link href="shoutbox.css" rel="stylesheet" type="text/css">
  143.  
  144. <body>
  145.  
  146. <script type="text/javascript">
  147. window.onload = function () {
  148.         // focus on the input field for easy access...
  149.         var input = document.getElementById ('message');
  150.         input.focus ();
  151.         // ...but if someone wishes to go back in their history, let them!
  152.         document.onkeydown = function (e) {
  153.             if (!e) {
  154.                 var e = window.event;
  155.             }
  156.             if (e.keyCode === 8 && !input.value) {
  157.                 history.back();
  158.             }
  159.         };
  160.     };
  161.  
  162. </script>
  • Anonymous
  • Bot
  • No Avatar
  • Posts: ?
  • Loc: Ozzuland
  • Status: Online

Post 3+ Months Ago

  • TheDayIsMine
  • Novice
  • Novice
  • TheDayIsMine
  • Posts: 22

Post 3+ Months Ago

/
  • alex89
  • Bronze Member
  • Bronze Member
  • User avatar
  • Posts: 239
  • Loc: Western Australia

Post 3+ Months Ago

My brain hurts. I'll take another look when I've got a bit more time
  • alex89
  • Bronze Member
  • Bronze Member
  • User avatar
  • Posts: 239
  • Loc: Western Australia

Post 3+ Months Ago

I've had another look, it looks like it should work ok. But it won't automatically run getShouts(), obviously, without a javascript cue. But that'll mean it'll have to refresh the page.

I can't think of another way to do it - sorry!
  • spork
  • Brewmaster
  • Silver Member
  • User avatar
  • Posts: 6241
  • Loc: Seattle, WA

Post 3+ Months Ago

Don't use a meta tag to refresh the page; use an AJAX request on a repeating timer to update the content of the element with the comments.

Post Information

  • Total Posts in this topic: 5 posts
  • Users browsing this forum: No registered users and 49 guests
  • You cannot post new topics in this forum
  • You cannot reply to topics in this forum
  • You cannot edit your posts in this forum
  • You cannot delete your posts in this forum
  • You cannot post attachments in this forum
 
 

© 1998-2014. Ozzu® is a registered trademark of Unmelted, LLC.