Question

我有一个评论回复系统，当我尝试回复评论时，第一个回复正常。

对于任何后续回复，我可以提交评论ID和文章ID，但我无法获得回复文本值。

如何每次根据所有回复的Razor代码进行此工作？

<h4>Comments</h4>
<hr />
@foreach (var item in Model.Comments.ToList())
{
    <!-- Single Comment -->
    <div class="media mb-4">
        <img style="height:40px; width:40px;" class="d-flex mr-3 rounded-circle" src="@item.User.Photo" alt="@item.User.FullName">
        <div class="media-body" style="width:400px;">
            <h5 class="mt-0">@item.User.UserName</h5>
            <div>
                <p style="word-break:break-all">
                    @item.Paragraph
                    @if (Convert.ToInt32(Session["UserId"]) == item.UserId)
                {
                        <a class="btn btn-danger" href="/Home/DeleteComment/@item.CommentId">
                            Delete
                        </a>

                        <div style="height:10px;"> <a id="post_id_1" name='comment1' class="showReply" href="javascript: void(0)">Reply</a></div>
                    }
                </p>
                <p style="font-size:small"><b>Yorum Tarihi:</b>@String.Format("{0: d MMMM yyyy}", item.Date)</p>
            </div>
            <!--Reply Form-->
            <div id="replymsgbox" style="display: none;">
                <form id="frmComment" novalidate="novalidate" method="POST" name="frmComment">
                    <div>
                        <textarea id="replytext" class="" name="comment1[text]"></textarea>
                        <div id="error_text"> </div>
                    </div>
                    <div>
                        <input id="@item.CommentId" class="reply" type="submit" value="Cevapla" name="Submit">
                    </div>
                </form>
            </div>


            @foreach (var reply in Model.ReplyComments.Where(x => x.CommentId == item.CommentId).ToList())
            {
                <div class="media mt-4">
                    <img style="height:40px; width:40px;" class="d-flex mr-3 rounded-circle" src="@item.User.Photo" alt="@item.User.FullName">
                    <div class="media-body">
                        <h5 class="mt-0">@reply.User.UserName</h5>
                        <p>@reply.Paragraph</p>
                        @if (Convert.ToInt32(Session["UserId"]) == item.UserId)
                        {
                            <a class="btn btn-danger" href="/Home/DeleteReply/@reply.ReplyCommentId">
                                Sil
                            </a>
                        }
                    </div>
                </div>
            }
        </div>
    </div>

这是我的javascript代码

<script type="text/javascript">

$(document).ready(function () {

    $('a.showReply').on("click", function (e) {
        $(this).parent("div").parent("div").next("div").slideToggle();
    });

    $(".reply").click(function (e) {

        e.preventDefault();
        var r_comment = $("#replytext").val();
        var r_commentid = parseInt($(this).attr("id"));
        $.ajax({
             url: '/Home/ReplyComment/',
             data: { replycomment: r_comment, articleid:@Model.ArticleId, commentid: r_commentid },
            type: 'POST',
            dataType: 'json',
            success: function (data) {
                alert("Cevap gönderildi");
                window.location.reload();

            }
        });

});
})

Answer 1

您使用id foreach生成了多个元素。在您的点击代码中，几乎在其他任何地方，您使用类引用作为选择器，这是好的。对于replytext，虽然你有：

replytext

当ID重复时，您尝试按ID引用元素。您需要为元素提供唯一ID，或者在尝试使用多个var r_comment = $("#replytext").val();选择器或某些搜索时手动遍历DOM。

在点击事件中，.parent()的上下文应该是按钮本身。这意味着使用this，您可以遍历一两个父项，然后向下遍历子项以查找填写的文本区域。你也可以尝试

this

理论上应该遍历上面堆栈中最近的形式，然后再遍历到文本区域元素。尝试在你的onclick中添加一个调试器并使用DOM来查看你的位置和需要，但是如果不是你需要的话，那个片段应该可以帮助你。

顺便说一下，将来如果要将生成的剃刀标记与JS混合使用，通常使用for循环为索引分配唯一ID通常是个好主意，这样无论你身在何处，你都可以做到根据您当前拥有的控件ID进行直接ID元素查找。

Answer 2

我用这个js代码解决了我的问题

  var r_comment = $(this).closest("form").find(".textreply").val();

感谢您的帮助：）

如何使用一个表单获取动态文本

2 个答案: