Question

我正在尝试实施评论系统。每个人都可以回复每条评论。这里的系统是当有人点击评论时，表格可见，他可以回复。所以如果有4条评论那么4个回复框就会到来。我想通过ajax存储这些回复。但问题是我无法指定实际提交的是哪个表单，因此我在指定带有类的表单时刷新了页面。我试图提交上面的表格，如果用户点击回复按钮，则会在每条评论下显示：

 <form class="replyComment">
      <textarea name="comment" class="ru_input" placeholder="Write your reply"></textarea>
      <input type="hidden" value="{{$row->id}}" name="comment_id">
      <div class="bt_area">
         <button class="floatRight btn btn-primary">Reply
         </button>
      </div>
   </form>

我试图通过跟随ajax提交。

$( ".replyComment").submit(function( event ) {      
 event.preventDefault();      
      $.ajaxSetup({
            headers: {
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
            }
          });
            $.ajax({
                type: "POST",
                url: '{{url("/postReply")}}',
                async: false,
                data: 
                {
                  product_id : {!! json_encode($product->id)!!},
                  comment : event.currentTarget[0].value,
                  comment_id : event.currentTarget[1].value
                },
                success: function(data) 
                {
                  console.log(data)

                },
                error:function(data)
                {

                }

            });
});

Answer 1

尝试使用id属性

来区分表单

        <form class="replyComment" id="1">
            <textarea name="comment" class="ru_input" placeholder="Write your reply"></textarea>
            <input type="hidden" value="{{$row->id}}" name="comment_id">
            <div class="bt_area">
                <button class="floatRight btn btn-primary">Reply
                </button>
            </div>
        </form>
        <form class="replyComment" id="2">
                <textarea name="comment" class="ru_input" placeholder="Write your reply"></textarea>
                <input type="hidden" value="{{$row->id}}" name="comment_id">
                <div class="bt_area">
                    <button class="floatRight btn btn-primary">Reply
                    </button>
                </div>
        </form>

并使用'＃'insted''。一边打电话一边

$( "#1").submit(function( event ) {      
 event.preventDefault();      
      $.ajaxSetup({
            headers: {
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
            }
          });
            $.ajax({
                type: "POST",
                url: '{{url("/postReply")}}',
                async: false,
                data: 
                {
                  product_id : {!! json_encode($product->id)!!},
                  comment : event.currentTarget[0].value,
                  comment_id : event.currentTarget[1].value
                },
                success: function(data) 
                {
                  console.log(data)

                },
                error:function(data)
                {

                }

            });
});


$( "#2").submit(function( event ) {      
 event.preventDefault();      
      $.ajaxSetup({
            headers: {
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
            }
          });
            $.ajax({
                type: "POST",
                url: '{{url("/postReply")}}',
                async: false,
                data: 
                {
                  product_id : {!! json_encode($product->id)!!},
                  comment : event.currentTarget[0].value,
                  comment_id : event.currentTarget[1].value
                },
                success: function(data) 
                {
                  console.log(data)

                },
                error:function(data)
                {

                }

            });
});

具有相同属性的多个表单

1 个答案: