Social Networking Site: Adding a Sub-comment to a Specific Post

Submitted by GeePee on Monday, March 16, 2015 - 21:01.
This tutorial is a continuation of our previous topic called “Facebook Wall Script Clone(What’s On Your Mind)”. But this time, we’re going to focus on how to add a sub comment in every shared post of a user. To start with this tutorial, create first a table in your database called “subcomment” and here’s the table structure of this table.
  1. CREATE TABLE IF NOT EXISTS `subcomment` (
  2.   `subc_id` INT(11) NOT NULL AUTO_INCREMENT,
  3.   `comment_id` INT(11) NOT NULL,
  4.   `subauthor` VARCHAR(255) NOT NULL,
  5.   `subcontent` text NOT NULL,
  6.   `created` datetime NOT NULL,
  7.   PRIMARY KEY (`subc_id`)
  8. ) ENGINE=MyISAM  DEFAULT CHARSET=latin1 AUTO_INCREMENT=13 ;
Then, let's open the home.php file, and on the last part of our code used for displaying the Post of every user. Or after this line of code echo '

'.$comm->content.'


';, add the following code: This code is used for displaying a text input for adding a new sub comment.
  1. echo '<table border="0">';
  2. /* this area is for listing of sub-comment*/
  3.  
  4. echo '<tr>';
  5. echo '<form action="save_subcomm.php" method="post">';
  6.         echo '<input name="commentid" type="hidden" value="'. $comm->id .'">';
  7.         echo '<input name="subauthor" type="hidden" value="'. $_SESSION['fName']. ' '. $_SESSION['lName'] .'">';
  8.        
  9.         $mydb->setQuery("SELECT * FROM photos WHERE `member_id`='{$_SESSION['member_id']}'");
  10.         $propic = $mydb->loadResultList();
  11.         if ($mydb->affected_rows()== 0){
  12.                 echo '<td><img src="./uploads/p.jpg" class="img-object" width="30px" height=30px" /></td>';    
  13.        
  14.         }
  15.         foreach ($propic as $obj){
  16.                 echo '<td >';
  17.                 echo '<img src="./uploads/'. $obj->filename.'" class="img-object" width="30px" height="30px" />';
  18.                 echo '</td>';
  19.         }      
  20.                                        
  21.         echo '<td><input name="subcontent" type="text" style="width: 370px;" class="form-control" placeholder="Write a comment...">';
  22.         echo '</form>';
  23. echo '</tr>';                          
  24. echo '</table>';
When you test the code above, it will look like as shown below: Next, we’re going to create a new PHP file called “save_subcomm.php”. This file will process the submitted data by the user and store into the database table name subcommittee. And here’s the following code:
  1. <?php
  2. require_once("includes/initialize.php");       
  3.  
  4.  $comment_id = $_POST['commentid'];
  5.  $content = $_POST['subcontent'];
  6.  $author = $_POST['subauthor'];
  7.  $created =  strftime("%Y-%m-%d %H:%M:%S", time());
  8.  
  9.  
  10.         global $mydb;
  11.         $mydb->setQuery("INSERT INTO `philsocialdb`.`subcomment` (`subc_id`, `comment_id`, `subauthor`, `subcontent`, `created`)
  12.                                                 VALUES (NULL, '{$comment_id}', '{$author}', '{$content}', '{$created}');");
  13.         $mydb->executeQuery();
  14.        
  15.         if ($mydb->affected_rows() == 1) {
  16.                
  17.                 echo "<script type=\"text/javascript\">
  18.                                         //alert(\"Comment created successfully.\");
  19.                                         window.location='home.php';
  20.                                 </script>";
  21.                
  22.         } else{
  23.                 echo "<script type=\"text/javascript\">
  24.                                         alert(\"Comment creation Failed!\");
  25.                                 </script>";
  26.         }
  27.  
  28.  
  29. ?>
Then after saving the sub comment in the database, we’re now going to display a list of a sub comment under the specific post of a user. To do this, add the following code in the area we provided under the table tag for adding a new sub comment.
  1. /* this area is for listing of sub-comment*/
  2. $mydb->setQuery("SELECT * FROM  `subcomment` WHERE `comment_id` = ".$comm->id );
  3. $sub = $mydb->loadResultList();
  4. foreach ($sub as $subcomm){
  5.                         echo '<tr>';
  6.                                
  7.                                         $mydb->setQuery("SELECT * FROM photos WHERE `member_id`='{$_SESSION['member_id']}'");
  8.                                                 $propic = $mydb->loadResultList();
  9.                                                 if ($mydb->affected_rows()== 0){
  10.                                                         echo '<td><img src="./uploads/p.jpg" class="img-object" width="30px" height=40px" /></td>';    
  11.                                                
  12.                                                 }
  13.                                                 foreach ($propic as $obj){
  14.                                                         echo '<td >';
  15.                                                         echo '<img src="./uploads/'. $obj->filename.'" class="img-object" width="30px" height="40px" />';
  16.                                                         echo '</td>';
  17.                                                 }      
  18.                                 echo '<td><a href="home.php?id='.$_SESSION['member_id'].'">'.$comm->author.'</a>';
  19.                                 echo '<br/><p>'.$subcomm->subcontent .'</p></td>';
  20.                         echo '</tr>';  
And after executing this code, you can test it in your browser and it will look like as shown below. Here’s now the code for home.php.
  1. <?php  
  2. require_once("includes/initialize.php");       
  3. ?>
  4. <!DOCTYPE html>
  5. <html lang="en">
  6.   <head>
  7.     <meta charset="utf-8">
  8.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
  9.     <meta name="description" content="">
  10.     <meta name="author" content="">
  11.     <link rel="shortcut icon" href="">
  12.  
  13.     <title>Philsocial</title>
  14.  
  15.     <!-- Bootstrap core CSS -->
  16.     <link href="css/bootstrap.css" rel="stylesheet">
  17.  
  18.     <!-- Custom styles for this template -->
  19.     <link href="jumbotron.css" rel="stylesheet">
  20.  
  21.     <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
  22.     <!--[if lt IE 9]>
  23.       <script src="../../assets/js/html5shiv.js"></script>
  24.       <script src="../../assets/js/respond.min.js"></script>
  25.     <![endif]-->
  26.         <?php
  27.             //login confirmation
  28.                 confirm_logged_in();
  29.         ?>
  30.   </head>
  31.  
  32.   <body>
  33.  
  34.     <div class="navbar navbar-inverse navbar-fixed-top">
  35.       <div class="container">
  36.         <div class="navbar-header">
  37.           <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
  38.             <span class="icon-bar"></span>
  39.             <span class="icon-bar"></span>
  40.             <span class="icon-bar"></span>
  41.           </button>
  42.           <a class="navbar-brand" href="home.php"><B>Philsocial</B></a>
  43.         </div>
  44.         <form class="navbar-form navbar-left">
  45.             <div class="form-group">
  46.                         <div class="rows">
  47.               <input type="text" placeholder="Email" class="form-control" size="40">
  48.             </div>
  49.            </div>
  50.           </form>
  51.                 <div class="navbar-collapse collapse">
  52.          
  53.           <form class="navbar-form navbar-right">
  54.             <ul class="nav navbar-nav">
  55.             <li class="active"><a href="home.php">Home</a></li>
  56.            <li class="dropdown">
  57.                        
  58.                         <a href="#" class="dropdown-toggle" data-toggle="dropdown">
  59.                         <?php
  60.                         //retrieve session variable
  61.                         echo $_SESSION['fName'];?>
  62.                                 <b class="caret"></b>
  63.                         </a>
  64.              
  65.                          <ul class="dropdown-menu">
  66.                 <li><a href="#">My Profile</a></li>
  67.                 <li><a href="#">Edit profile</a></li>
  68.                 <li><a href="#">Edit profile Picture</a></li>
  69.                                 <li><a href="#">Customize profile</a></li>
  70.                                 <li><a href="#">Edit Work and Education</a></li>
  71.                
  72.               </ul>
  73.             </li>
  74.                         <li class="dropdown">
  75.  
  76.                         <a href="#" class="dropdown-toggle" data-toggle="dropdown">Account<b class="caret"></b></a>
  77.              
  78.                          <ul class="dropdown-menu">
  79.                 <li><a href="#">Account Settings</a></li>
  80.                 <li><a href="#">Privacy Settings</a></li>
  81.                 <li><a href="#">Manage Social Accounts</a></li>
  82.                                 <li><a href="#">Manage Credits</a></li>
  83.                                 <li><a href="logout.php">Logout</a></li>
  84.                
  85.               </ul>
  86.             </li>
  87.           </ul>
  88.                 </form>
  89.         </div><!--/.navbar-collapse -->
  90.       </div>
  91.     </div>
  92. <div class="container">
  93.                 <div class="well">
  94.        
  95.                         <div class="row">
  96.                                 <div class="col-xs-6 col-md-2">
  97.                                                 <a data-target="#myModal" data-toggle="modal" href="" title=
  98.                                                 "Click here to Change Image.">
  99.                                 <?php
  100.                                
  101.                                 $mydb->setQuery("SELECT * FROM photos WHERE `member_id`='{$_SESSION['member_id']}'");
  102.                                 $cur = $mydb->loadResultList();
  103.                                 if ($mydb->affected_rows()== 0){
  104.                                         echo '<img src="./uploads/p.jpg" class="img-thumbnail" width="200px" height="100px" />';       
  105.                                
  106.                                 }
  107.                                 foreach($cur as $object){
  108.                                    
  109.                                                 echo '<img src="./uploads/'. $object->filename.'" class="img-thumbnail" width="200px" height="100px" />';
  110.                                        
  111.                                         }      
  112.                                 ?>
  113.                                         </a>   
  114.                                        
  115.                                 <!-- Modal -->
  116.                                         <div class="modal fade" id="myModal" tabindex="-1">
  117.                                                 <div class="modal-dialog">
  118.                                                         <div class="modal-content">
  119.                                                                 <div class="modal-header">
  120.                                                                         <button class="close" data-dismiss="modal" type=
  121.                                                                         "button">×</button>
  122.  
  123.                                                                         <h4 class="modal-title" id="myModalLabel">Choose Your best
  124.                                                                         picture for your Profile.</h4>
  125.                                                                 </div>
  126.  
  127.                                                                 <form action="save_photo.php" enctype="multipart/form-data" method=
  128.                                                                 "post">
  129.                                                                         <div class="modal-body">
  130.                                                                                 <div class="form-group">
  131.                                                                                         <div class="rows">
  132.                                                                                                 <div class="col-md-12">
  133.                                                                                                         <div class="rows">
  134.                                                                                                                 <div class="col-md-8">
  135.                                                                                                                         <input name="MAX_FILE_SIZE" type=
  136.                                                                                                                         "hidden" value="1000000"> <input id=
  137.                                                                                                                         "upload_file" name="upload_file" type=
  138.                                                                                                                         "file">
  139.                                                                                                                 </div>
  140.  
  141.                                                                                                                 <div class="col-md-4"></div>
  142.                                                                                                         </div>
  143.                                                                                                 </div>
  144.                                                                                         </div>
  145.                                                                                 </div>
  146.                                                                         </div>
  147.  
  148.                                                                         <div class="modal-footer">
  149.                                                                                 <button class="btn btn-default" data-dismiss="modal" type=
  150.                                                                                 "button">Close</button> <button class="btn btn-primary"
  151.                                                                                 name="savephoto" type="submit">Save Photo</button>
  152.                                                                         </div>
  153.                                                                 </form>
  154.                                                         </div><!-- /.modal-content -->
  155.                                                 </div><!-- /.modal-dialog -->
  156.                                         </div><!-- /.modal -->
  157.                                 </div>
  158.  
  159.                                 <div class="col-xs-12 col-sm-6 col-md-8">
  160.                                         <div class="page-header">
  161.                                                 <h3><?php echo $_SESSION['fName']. ' '. $_SESSION['lName'];?></h3>
  162.                                         </div>
  163.  
  164.                                         <ul class="nav nav-tabs">
  165.                                                 <li class="active">
  166.                                                         <a href="#">Wall</a>
  167.                                                 </li>
  168.  
  169.                                                 <li>
  170.                                                         <a href="info.php">Info</a>
  171.                                                 </li>
  172.  
  173.                                                 <li>
  174.                                                         <a href="message.php">Messages</a>
  175.                                                 </li>
  176.                                         </ul>
  177.                                 <div class="well">
  178.                                         <div class="panel-group" id="accordion">
  179.                                           <div class="panel panel-primary">
  180.                                                 <div class="panel-heading">
  181.                                                   <h5 class="panel-title">
  182.                                                         <a data-toggle="collapse" data-parent="#accordion" href="#collapseOne" title="What's on your mind?">
  183.                                                          Update Status
  184.                                                         </a>
  185.                                                         </h5>
  186.                                                 </div>
  187.                                                
  188.                                                 <form action="save_post.php" method="POST">
  189.                                                 <div id="collapseOne" class="panel-collapse collapse">
  190.                                                   <div class="panel-body">
  191.                                                         <input type="hidden" name="comment_id" value="<?php echo $_SESSION['member_id']; ?>">
  192.                                                         <input type="hidden" name="author" value="<?php echo $_SESSION['fName']. ' '. $_SESSION['lName']; ?>">
  193.                                                         <input type="hidden" name="to" value="<?php echo $_SESSION['member_id']; ?>">
  194.                                                         <textarea class="form-control" name="content" placeholder="What's on your mind?"></textarea>
  195.                                                                
  196.                                                 </div>
  197.                                                 <div class="panel-footer" align="right">
  198.                                                         <button class="btn btn-primary btn-sm" type="submit" name="share">Share</button>
  199.                                                 </div>
  200.                                                 </div>
  201.                                                 </form>
  202.                                           </div>
  203.                                         </div>                 
  204.                                         <?php
  205.                                         global $mydb;  
  206.                                         $mydb->setQuery("SELECT * from comments where comment_id=".$_SESSION['member_id']." ORDER BY created DESC");
  207.                                         $cur = $mydb->loadResultList();
  208.                                
  209.                                         echo '<div class="table table-responsive" border="0">';
  210.                                         echo '<table>';
  211.                                         echo '<tr>';
  212.                                                
  213.                                         foreach ($cur as $comm){
  214.                                                 $mydb->setQuery("SELECT * FROM photos WHERE `member_id`='{$_SESSION['member_id']}'");
  215.                                                 $propic = $mydb->loadResultList();
  216.                                                 if ($mydb->affected_rows()== 0){
  217.                                                         echo '<td rowspan="2"><img src="./uploads/p.jpg" class="img-object" width="50px" height=60px" /></td>';
  218.                                                
  219.                                                 }
  220.                                                 foreach ($propic as $obj){
  221.                                                         echo '<td rowspan="2">';
  222.                                                         echo '<img src="./uploads/'. $obj->filename.'" class="img-object" width="50px" height="60px" />';
  223.                                                         echo '</td>';
  224.                                                 }      
  225.                                                 echo  '</tr>';
  226.                                                
  227.                                                 echo '<tr>';
  228.                                                
  229.                                                 echo '<td><strong><a href="home.php?id='.$_SESSION['member_id'].'">'.$comm->author.'</a></strong>';            
  230.                                                                                
  231.                                                 echo '<br/><p>'.$comm->content.'</p><br/>';
  232.                                        
  233.                                                 echo '<table border="0">';
  234.                                                 /* this area is for listing of sub-comment*/
  235.                                                 $mydb->setQuery("SELECT * FROM  `subcomment` WHERE `comment_id` = ".$comm->id );
  236.                                                 $sub = $mydb->loadResultList();
  237.                                                 foreach ($sub as $subcomm){
  238.                                                                         echo '<tr>';
  239.                                                                                
  240.                                                                                         $mydb->setQuery("SELECT * FROM photos WHERE `member_id`='{$_SESSION['member_id']}'");
  241.                                                                                                 $propic = $mydb->loadResultList();
  242.                                                                                                 if ($mydb->affected_rows()== 0){
  243.                                                                                                         echo '<td><img src="./uploads/p.jpg" class="img-object" width="30px" height=40px" /></td>';    
  244.                                                                                                
  245.                                                                                                 }
  246.                                                                                                 foreach ($propic as $obj){
  247.                                                                                                         echo '<td >';
  248.                                                                                                         echo '<img src="./uploads/'. $obj->filename.'" class="img-object" width="30px" height="40px" />';
  249.                                                                                                         echo '</td>';
  250.                                                                                                 }      
  251.                                                                                 echo '<td><a href="home.php?id='.$_SESSION['member_id'].'">'.$comm->author.'</a>';
  252.                                                                                 echo '<br/><p>'.$subcomm->subcontent .'</p></td>';
  253.                                                                         echo '</tr>';                          
  254.                                                        
  255.                                                                
  256.                                                                                                
  257.                                                 }
  258.                                                                                        
  259.                                                         //This area is for creating a new comment
  260.                                                        
  261.                                                                         echo '<tr>';
  262.                                                                         echo '<form action="save_subcomm.php" method="post">';
  263.                                                                                 echo '<input name="commentid" type="hidden" value="'. $comm->id .'">';
  264.                                                                                 echo '<input name="subauthor" type="hidden" value="'. $_SESSION['fName']. ' '. $_SESSION['lName'] .'">';
  265.                                                                                
  266.                                                                                 $mydb->setQuery("SELECT * FROM photos WHERE `member_id`='{$_SESSION['member_id']}'");
  267.                                                                                 $propic = $mydb->loadResultList();
  268.                                                                                 if ($mydb->affected_rows()== 0){
  269.                                                                                         echo '<td><img src="./uploads/p.jpg" class="img-object" width="30px" height=30px" /></td>';    
  270.                                                                                
  271.                                                                                 }
  272.                                                                                 foreach ($propic as $obj){
  273.                                                                                         echo '<td >';
  274.                                                                                         echo '<img src="./uploads/'. $obj->filename.'" class="img-object" width="30px" height="30px" />';
  275.                                                                                         echo '</td>';
  276.                                                                                 }      
  277.                                                                                
  278.                                                                         echo '<td><input name="subcontent" type="text" style="width: 370px;" class="form-control" placeholder="Write a comment...">';
  279.                                                                         echo '</form>';
  280.                                                                 echo '</tr>';                          
  281.                                                                 echo '</table>';
  282.                                                         //echo '</div>';
  283.                                                 /*
  284.                                                 End of New sub comment.
  285.                                                 */                                                     
  286.                                                 echo '</div>';
  287.                                                 echo '</div>';
  288.                                                 echo  '</tr>';
  289.                                                
  290.                                                        
  291.                                         }
  292.                                         echo '</table>';
  293.                                         ?>
  294.                                        
  295.                                 </div>
  296.                                
  297.                                 </div>
  298.                         </div>
  299.                 </div>
  300.         </div>
  301.  
  302.        
  303.      
  304.   </body>
  305. </html>
  306.  
  307.       <hr>
  308.    
  309.     </div> <!-- /container -->
  310.         <footer>
  311.         <p align="center">&copy; Philsocial 2013</p>
  312.     </footer>
  313.     <!-- Bootstrap core JavaScript
  314.     ================================================== -->
  315.     <!-- Placed at the end of the document so the pages load faster -->
  316.      <script src="js/tooltip.js"></script>
  317.         <script src="assets/js/jquery.js"></script>
  318.     <script src="js/bootstrap.min.js"></script>
  319.          <script src="js/popover.js"></script>
  320.          
  321.        
  322.   </body>
  323. </html>
Tags
networking
social networking
add comments

Comments

Submitted by kefasi jaravaza (not verified) on Fri, 09/22/2017 - 20:44

the code is awesome

Add new comment

About text formats