AJAX评论系统验证问题

时间:2014-06-01 12:13:14

标签: javascript php jquery ajax forms

所以我正在浏览这个页面,它正在显示文章和每个文章,它将有一个textarea要求允许用户插入注释。我做了AJAX,它工作正常。一些验证工作正常(意思是如果textarea是空的,它将不会提交评论并显示错误)。我正在进行此验证的方式是使用ID.So我有多个表格具有相同的ID。为了表示提交它工作正常但是当我继续使用第二个表格时,验证不起作用它只适用于第一个表格

AJAX代码

 $(document).ready(function(){

   $(document).on('click','.submitComment',function(e) {

        e.preventDefault();
        //send ajax request
        var form = $(this).closest('form');
        var comment  = $('#comment');
        if (comment.val().length > 1) 
        {
            $.ajax({
                url: 'ajax_comment.php',
                type: 'POST',
                cache: false,
                dataType: 'json',
                data: $(form).serialize(), //form serialize data
                beforeSend: function(){
                    //Changeing submit button value text and disableing it
                    $(this).val('Submiting ....').attr('disabled', 'disabled');
                },
                success: function(data)
                {
                    var item = $(data.html).hide().fadeIn(800);
                    $('.comment-block_' + data.id).append(item);

                    // reset form and button
                    $(form).trigger('reset');
                    $(this).val('Submit').removeAttr('disabled');
                },
                error: function(e)
                {
                    alert(e);
                }
            });
        }
        else
        {
            alert("Hello");
        }
    });
});

的index.php

<?php 
    require_once("menu.php");
?>
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js" type="text/javascript"></script>
        <script  src="comments.js" type="text/javascript" ></script>
<?php

    $connection = connectToMySQL();


    $selectPostQuery = "SELECT * FROM (SELECT * FROM `tblposts` ORDER BY id DESC LIMIT 3) t ORDER BY id DESC";

    $result = mysqli_query($connection,$selectPostQuery)
        or die("Error in the query: ". mysqli_error($connection));
    while ($row = mysqli_fetch_assoc($result)) 
    {
        $postid = $row['ID'];

?>
        <div class="wrapper">
        <div class="titlecontainer">
        <h1><?php echo $row['Title']?></h1>
        </div>
        <div class="textcontainer">
        <?php echo $row['Content']?>
        </div>
<?php
        if (!empty($row['ImagePath'])) #This will check if there is an path in the textfield
        {
?>
            <div class="imagecontainer">
            <img src="images/<?php echo "$row[ImagePath]"; ?>" alt="Article Image">
            </div>
<?php
        }
?>
        <div class="timestampcontainer">
        <b>Date posted :</b><?php echo $row['TimeStamp']?>
        <b>Author :</b> Admin
        </div>
<?php
        #Selecting comments corresponding to the post
        $selectCommentQuery = "SELECT * FROM `tblcomments` LEFT JOIN `tblusers` ON tblcomments.userID = tblusers.ID WHERE tblcomments.PostID ='$postid'";

        $commentResult = mysqli_query($connection,$selectCommentQuery)
            or die ("Error in the query: ". mysqli_error($connection));

        #renderinf the comments

        echo '<div class="comment-block_' . $postid .'">';

        while ($commentRow = mysqli_fetch_assoc($commentResult)) 
        {
?>
            <div class="commentcontainer">
            <div class="commentusername"><h1>Username :<?php echo $commentRow['Username']?></h1></div>
            <div class="commentcontent"><?php echo $commentRow['Content']?></div>
            <div class="commenttimestamp"><?php echo $commentRow['Timestamp']?></div>
            </div>
<?php
        }
?>
        </div>
<?php 

        if (!empty($_SESSION['userID']) ) 
        {
?>
            <form method="POST" class="post-frm" action="index.php" >
            <label>New Comment</label>
            <textarea id="comment" name="comment" class="comment"></textarea>
            <input type="hidden" name="postid" value="<?php echo $postid ?>">
            <input type="submit" name ="submit" class="submitComment"/>
            </form>
<?php
        }
        echo "</div>";
        echo "<br /> <br /><br />"; 
    }
 require_once("footer.php") ?>

同样问题是第一种形式工作正常,但第二种形式和onwaord不能正常工作

1 个答案:

答案 0 :(得分:1)

试试这个:

var comment  = $('.comment',form);

而不是

var comment  = $('#comment');

这样您就可以定位属于您正在验证的表单的textarea

PS。

从元素中删除id或使用php使其唯一,所有元素ID都应该是唯一的