2017-03-07 60 views
0

我做了一个Facebook风格的发布和评论页面,用户可以发布帖子并对帖子发表评论。显示从数据库返回的数组数据,无需刷新页面

我的第一个问题是当我试图对帖子发表评论时,插入到我的数据库中的postID是最新的帖子,即使我对不同的postID发表评论。

接下来的问题是我想实现的是,在发表评论后,即使我不刷新页面,评论部分也会弹出评论。我已经尝试寻找一种可能的解决方案,但没有一种符合我想要做的。

这里是我的网页代码:

post.php中

<?php 

foreach ($post_model->getcomment($postid) as $value) { 
    if($postid == $value['post_uid']){ 
     ?> 
     <div id="mycomments" class="col-lg-12" style="background:#eff9c7;"> 
      <img src="./<?php echo $session_image?>" class="pull-left" style="border-radius:50%;margin-top:10px;" width="7%" height="7%" /> 
      <p style="margin-top:18px;line-height:15px;"><strong class="font-1" style="margin-left:10px;"><?php echo $session_fname.' '.$session_lname?></strong> <?php echo $value['pc_comment']?><br> 
       <span class="" style="margin-left:10px;font-size:.9em;color:gray;"><abbr class="timeago" title="<?php echo $value['pc_datesend']?>"></abbr></span> 
      </p> 
     </div> 
     <?php 
    } 
} 
?> 

<div class="col-lg-12" style="background:#eff9c7;"> 
    <!-- <img src="../img/icons/no-icon-available.png" class="pull-left" style="border-radius:50%;margin-top:10px;" width="7%" height="7%" />--> 
    <input type="text" name="mycomment" id="mycomment" class="form-control pull-right" style="width:92%;margin-top:17px;" placeholder="Comments..." /> 
</div> 

下面的代码将我的评论发送到我的数据库:

$(document).ready(function() { 

    $('input[name="mycomment"]').on('keyup', function(e){ 

    e.preventDefault(); 
    var comments = $(this).val(); 
    var sid = $("#sid").val(); 
    var ses_image = <?php echo json_encode($session_image); ?>; 
    var ses_fname = <?php echo json_encode($session_fname); ?>; 
    var ses_lname = <?php echo json_encode($session_lname); ?>; 

    if(e.keyCode == 13){ 
     if(comments.length){ 
      $.ajax({ 
       url: "../controller/post_controller.php", 
       type: "POST", 
       data:{ 
        "id":sid, 
        "comments":comments, 
        "image":ses_image, 
        "fname":ses_fname, 
        "lname":ses_lname 
       }, 
       dataType: "json", 
       success: function(data){ 
        alert(Object.keys(data).length); 
        comments = ''; 
        $("#sid").val(''); 
        $("#mycomments").append(); // i dont know what to put here 
       } 
      }); 

     else 
      alert("Please write something in comment."); 
     } 

    }); 
}); 

,最后这个我功能,我插入并选择我的数据:

class post { 

    public $dbh; 

    public function __construct(PDO $dbh){ 
     $this->dbh = &$dbh; 
    } 

    function comment($postuid,$uimage,$ufname,$ulname,$comment){ 
     $sql = "INSERT INTO pcomment (post_uid,pc_uimage,pc_ufname,pc_ulname,pc_comment,pc_datesend) VALUES('$postuid','$uimage','$ufname','$ulname','$comment',NOW())"; 
     $query = $this->dbh->prepare($sql); 
     var_dump($query); 
     $result = ($query->execute()? true :false); 
     return $result; 
    } 

    function getcomment($mmyid){ 
     $sql = "SELECT * FROM pcomment WHERE post_uid = '$mmyid'"; 
     $stmt = $this->dbh->prepare($sql); 
     $stmt->execute(array("0")); 
     $active_data = $stmt->fetchAll(PDO::FETCH_ASSOC); 
     return $active_data; 
    } 
} 

Controller.php这样

if(session_id() == '' || !isset($_SESSION)) 
    session_start(); 
$session_id = $_SESSION['id']; 
require_once('../model/dbconfig.php'); 
require_once('../model/post.php'); 
$database = new Database(); 
$conn = $database->getConnection(); 
$com = new post($conn); 
$comments = ($_POST['comments']); 
$uid = ($_POST['id']); 
$pc_uimage = ($_SESSION['image']); 
$pc_ufname = ($_SESSION['firstname']); 
$pc_ulname = ($_SESSION['lastname']); 

if(isset($_POST['id']) && isset($_POST['comments'])) 
{ 
    $res = $com->comment($uid,$pc_uimage,$pc_ufname,$pc_ulname,$comments); 
} 

$res = $com->getcomment($uid); 
echo json_encode($res); 

回答

0

你描述的声音是什么样的可以通过使用不同的技术/方法来解决。例如,如果您将AJAX请求发布到服务器进行创建后,您可以返回创建的帖子并更新您的页面(使用jQuery,vanilla JavaScript或任何其他框架)。您可能还想要某种服务器端推送(Web套接字,长轮询等)。

如果您有兴趣将实时通知集成到您的页面,我会先看看pusher.compubnub.com等服务。这些服务允许您订阅从您的服务器触发的事件,以便您可以“听”您感兴趣的帖子中的更改。例如,您可能会创建一个频道服务器端,以便对您的帖子进行广播更改。然后,在客户端上,您可以订阅 这样的频道,并在应该显示更新时轻松通知。这可以用10行来实现,所以它确实值得。

顺便说一句。这两项服务都提供免费的服务,非常适合中小型项目。我自己已经在生产应用程序中使用它们,无需支付一毛钱,因此它们可能对您的案例来说非常完美

0

您的请求的ajax结果是JSON。所以你需要用你的javascript数组结果重新创建你的评论的HTML。您可以使用jQuery来创建HTML标记,并追加到#comments DIV

0

只刷新后阿贾克斯成功DIV

jQuery("#your_div").load(refreshurl , function() { 
    // do. stuff 
}); 
相关问题