John Davidson

Message:

I'm working on my school project which is gallery, a clone of flickr and unsplash really.
Right now I was working on comments system which works rather well all things considered, but I also want to add replies under those comments and having textfields under each comment seems clunky, so I wrote small jQuery script for it:

This is test file for this part of the code, as I don't want to ruin something in the main project if something happens.
PHP/HTML

<?php 



    require_once 'header.php';



    if(isset($_POST['submit-comment']))

    {

        require_once 'includes/dbh.inc.php';



        $userUid = "Bob";

        $comment = $_POST['comment-input'];

        $pageId = 24;

        $parentId= -1;

        $date = date("Y-m-d H:m:s");



        $sql = "INSERT INTO comments(commentsPageId, commentsParentsId, commentsUseruid, commentsContent, commentsDate) VALUES (?,?,?,?,?);";

        $stmt = mysqli_stmt_init($conn);

        if(!mysqli_stmt_prepare($stmt, $sql))

        {

            echo "OPPSIE!";

        }

        else

        {

            mysqli_stmt_bind_param($stmt, "iissi", $pageId, $parentId, $userUid, $comment, $date);

            mysqli_stmt_execute($stmt);

        }

        mysqli_stmt_close($stmt);

    }





    $sqlSec = "SELECT commentsId, commentsUseruid, commentsContent, commentsDate FROM comments WHERE commentsPageId=24;";

    $stmtSec = mysqli_stmt_init($conn);

    if(!mysqli_stmt_prepare($stmtSec, $sqlSec))

    {

        echo "OPPSIE!";

    }

    else

    {

        mysqli_stmt_execute($stmtSec);

        $result = mysqli_stmt_get_result($stmtSec);

        echo '

                <div class="comments_container">

                    <div class="comment-post">

                        <form action="" method="post">

                            <textarea name="comment-input" cols="100" rows="4" style="resize: none;" placeholder="Write your comment..."></textarea>

                            <button type="submit" name="submit-comment">Post comment</button>

                        </form>

                    </div>

                    <div class="comments">

                ';

        while($row = mysqli_fetch_assoc($result))

        {

            $commentId = $row["commentsId"];

            echo '

            <div class="comment_'.$commentId.'"?

                <div class="header">

                    <p class="name" style="color: black;">'.$row["commentsUseruid"].'</p>

                    <span class="date">'.$row["commentsDate"].'</span>

                </div>

                <p class="content" style="color: black;">'.$row["commentsContent"].'</p>  

                <div class="reply_'.$commentId.'">

                    <form action="" method="post">

                        <textarea id="reply" name="comment-input" cols="80" rows="2" style="resize: none;" placeholder="Write your comment..."></textarea>

                        <button type="submit" name="submit-comment">Post comment</button>

                    </form>

                </div>

                <button class="replybtn_'.$commentId.'">Reply</button>

            ';

        }

        echo '</div>';

        echo '</div>';

    }

?>

jQuery

    var id= '<?php echo $commentId; ?>';

    var reply = ".reply_";

    var selectorReply = reply.concat(id);

    var replybtn = ".replybtn_";

    var selectorBtn = replybtn.concat(id);

    $(selectorBtn).click(function(){

        $(selectorReply).toggle()

    });

This kinda works, but while($row = mysqli_fetch_assoc($result)), just spins through all id's and stops at the last one, so all reply buttons only work on the last comment.
Question is how do I apply this script to all comments, instead of only the last so that reply buttons show textfields that are appropriate?

---

My Answer:
To apply the jQuery script to all comments instead of just the last one, you can modify the script to use classes instead of IDs for the reply textfields and buttons. Here's how you can update your code:

PHP/HTML:
php
while($row = mysqli_fetch_assoc($result))
{
$commentId = $row["commentsId"];
echo '