0

概括

我有一个页面,其结构与您在 twitter 中发现的结构不同:一个帖子(“tweet”)提要,每个帖子都有一个内部有序列表(ol),该帖子的评论(tweet)所在的位置。我正在使用 AJAX 提交帖子(来自同一页面上的表单),还使用 ​​AJAX 提交对该特定(或任何其他)帖子的评论。

问题

当我向帖子提交第一条评论时,页面会重新加载(在这种情况下会转到 post_comment.php 并显示其结果)。在获得第一条评论并提交第二条评论后,一切顺利。

我将在下面展示代码。你能帮帮我吗?这很可能是一件非常简单的事情。

流动

  1. Main_page.php - jquery、jquery 表单插件和 post_comment 的脚本声明在哪里,主要结构在哪里。
  2. Main_page Post - 通过 ajax(ajaxForm - 来自 jquery 表单插件)发布到 main_page.php。这篇文章还有一个表单,其中包含要发送以提交评论的 2/3 元素。
  3. 发表评论 - 通过之前提交的帖子提交。通过 ajaxForm 调用 post_comment.php。如上所述,第一次(当评论 ol 为空时)失败。在获得第一条评论后,无需重新加载页面即可添加新评论。

JS:

        $(function() {

//var this = $(this).closest('.form_wrapper-feed').next().find('.comments-feed').child("ol.post_comment_list");
var options = { 

    //clearForm: true,
    //resetForm: true,
    //beforeSubmit: ShowRequest,


    url: 'post_comment.php',
    success: function(html) 
    {

    var arrHTML = html.split('|');
        var postId = $.trim(arrHTML[0]);
        var html_code =  arrHTML[1];
        var target = 'ol#post_comment_list'+postId;
        console.log('codigo html'+html_code);
        console.log('aqui vai o post id'+postId);
        console.log('aqui vai o target'+target);
        $('ol#post_comment_list'+postId).append(html_code);
        //$('ol#post_comment_list'+postId 'li:first').slideDown('slow');
        $('.footer-post').hide();
        $('.comments-feed').delay(2000).slideUp({duration: 1000, queue: true});
        $('.small-textarea-main-feed').removeClass('set-large');
        resetForm($('.footer-comment'));
    },
    error: function()
    {
        alert('ERROR: unable to upload files');

    },
    complete: function() 
    {

        //$('form#post-question-form')[0].reset();
        //resetForm($('#post-question-form'));

    },


}; 

        $(".footer-comment").ajaxForm(options);

         function ShowRequest(formData, jqForm, options) {
         var queryString = $.param(formData);
          alert('BeforeSend method: \n\nAbout to submit: \n\n' + queryString);
          return true;
         }

function resetForm($form) {
    $form.find('input:text, input:password, input:file, select, textarea').val('');
    $form.find('input:radio, input:checkbox')
         .removeAttr('checked').removeAttr('selected');

}




     });

PHP(发表评论)

     <?php
              include 'C:/xampp/htdocs/dh/core/init.php';
              // form registration validation
              if (empty($_POST) === false) {
                $required_fields = array('comment');

                foreach($_POST as $key => $value) {
                  if (empty($value) && in_array($key, $required_fields) === true) {
                    $errors[] = 'All fields are required';
                    break 1;
                  }
                }


                if (empty($errors) === true) {

                  // preg_match retunns an int, so it has only 2 == as oppposed to ===
                  if (strlen($_POST['comment']) > 300) {
                    $errors[] = 'Your answer must be less than 300 characters';
                  }

                }

              }
              //print_r($errors);

              ?>



              <?php 
              if (empty($_POST) === false && empty($errors) === true) {
                //register user
                $post_comment = array(
                  'comment'      => $_POST['comment'],
                  'id'      => $_POST['id'],
                  );


                //echo $post_comment['id'];

                $user_id = $_SESSION['user_id'];
                post_comment_db($user_id, $post_comment);
                  //print_r($post_question['tags']);
                echo load_comment($user_id,$post_comment);
                //add_new_comment();
                //load_top_questions();


              } else{
                echo output_errors($errors);
              }
              ?>

PHP/HTML(...使用以下代码添加新评论 - post_comment.php 的输出 - 这部分在单独的 users.php 文件中计算)

          function load_comment($user_id,$post_comment){

            $comment = $post_comment['comment'];
            $username = mysql_result(mysql_query("SELECT `username` FROM `users` WHERE `user_id` = $user_id"), 0, 'username');
            $comment_id = mysql_result(mysql_query("SELECT `comment_id` FROM `comments` WHERE `message` = '$comment'"), 0, 'comment_id');
            $timestamp = mysql_result(mysql_query("SELECT `timestamp` FROM `comments` WHERE `comment_id` = $comment_id"), 0, 'timestamp');
            //$timestamp = mysql_result(mysql_query("SELECT `timestamp` FROM `comments` WHERE `user_id` = $user_id"), 0, 'timestamp');
            $r = format_time($timestamp);

            $question_id = $post_comment['id'];

            $q = "SELECT `comment_id` FROM `question_has_comments` WHERE `question_id` = $question_id ORDER BY `timestamp` DESC LIMIT 1" ;
            $q = "SELECT `comment_id` FROM `comments` WHERE `question_id` = $question_id ORDER BY `timestamp` DESC LIMIT 1" ;

            $post_id = $post_comment['id'];

            $send_back = $post_id . '|' . '<li id="' .$post_comment['id']. '" class="post_comment">                                     

                        <div id="" class="give-margin">
                            <div id="" class="profile-page-avatar-wrapper"> 
                                <a href="#"><img id="" class="profile-page-avatar-image" src="./images/test/chemistry.jpg" alt=""></a><!--  A imagem -->
                            </div>

                            <div id="" class="profile-page-uploader-tools"> 

                                <div id="" class="profile-image-btn">
                                    <div id="" class="profile-page-btn-wrapper">
                                        <div id="" class="header-id">
                                            <a href="#"><span id="user-name">' . $username . '</span></a>   
                                        </div>
                                        <div id="" class="question-page-feed-answer-header-timer">
                                            <a id="feed-answer-header-timer" href="#"><span class="timer" data-time="">' . $r . '</span></a>
                                        </div>
                                    </div> <!-- fecha Div wrapper do botao-->
                                </div> 

                                <p>' . $post_comment['comment'] . '</p>
                            </div>                                  
                        </div>
                    </li>
                ';

            echo $send_back;
            }
4

0 回答 0