Laravel将ID从提取的数据传递给AJAX


Laravel Passing ID from fetched data to AJAX

我不知道该怎么做。所以基本上我得到了一个这样的多条评论表单:

@foreach($lists as $list)
    //some views 
    <form class="commentForm">
        <input type="text" class="commentBox" name="comment" />
        <input type="submit" class="submitBtn" value="Comment" />
    </form>
@endforeach

我想实现AJAX,这样每当用户评论某个内容时,页面就不会重新加载。我目前提交评论的途径是:

Route::post('list/{listID}/comment', 'ListController@comment');

我不知道如何将该ID从视图传递到AJAX,然后再返回到控制器。我尝试了一个显而易见的方法,在AJAX url中使用'list/{{ $list->id }}/comment',但没有成功。也尝试了一些其他的东西,但基本上都是徒劳的。

提前谢谢!

编辑:我的AJAX代码:

$(document).ready(function(){
$(document).on("submit", '.commentForm', function(e){
    $.ajaxSetup({
        headers: {
            'X-CSRF-TOKEN': $('meta[name="_token"]').attr('content')
        }
    });
    var data = $(this).serialize();
    var me= this;
    $.ajax({
        type: 'POST',
        url: 'posts/{{ $auction->id }}/comment',
        data: data,
        datatype: 'JSON',
        success:function(data){
            console.log(data);
        },
        error:function(data){
            console.log(data);
        }
    });
    return false;
})
});

我只是暂时对输出进行console.log,看看它是否有效。

在laravel中,它们使用刀片模板。我不知道你把ajax代码放在哪里,但当你使用扩展名.blade.php.时,这些括号:{{}},{!!}只会被视为模板

在laravel中,您可以使用resource/views下的.php作为html模板,但{{}}、{!!!}和其他blade语法中的php将被视为普通文本,而不是再次进行解释。如果你需要,通常我会做这样的布局:

<html>
    <head>
        @yield("sytles")
        @yield("additionalstyles")
        @yield("includestyles")
        ................//as many as you need
    </head>
    <body>
        <div>@yield("content")</div>//content here
        @yield("scripts")
        @yield("additionalscripts")
        @yield("includescripts")
        ................//as many as you need
    </body>
</html>

然后在视图中,当我需要发出ajax请求时,我会将其封装在@section("script")@stop或任何尚未使用的yield中,因此例如,使用此模板后,代码的视图部分可能会是这样的:

@extends("layout")
@section("content")
@foreach($lists as $list)
    //some views 
    <form class="commentForm">
        <input type="text" class="commentBox" name="comment" />
        <input type="submit" class="submitBtn" value="Comment" />
    </form>
@endforeach
@stop
@section("additionalscript")
<script>
    $(document).ready(function(){
    $(document).on("submit", '.commentForm', function(e){
        $.ajaxSetup({
            headers: {
                'X-CSRF-TOKEN': $('meta[name="_token"]').attr('content')
            }
        });
        var data = $(this).serialize();
        var me= this;
        $.ajax({    
            type: 'POST',
            url: 'posts/{{ $auction->id }}/comment',
            data: data,
            datatype: 'JSON',
            success:function(data){
                console.log(data);
            },
            error:function(data){
                console.log(data);
            }
        });
        return false;
    })
    });
</script>
@stop

这样,你的

url: 'posts/{{ $auction->id }}/comment',

将被呈现为类似的东西

url: 'posts/hansishandsome/comment',

希望这能帮助

我建议使用jQuery的.data()功能,所以在foreach循环中,您可以这样做:

<form class="commentForm" data-id="{{$list->id}}">
    <input type="text" class="commentBox" name="comment" />
    <input type="submit" class="submitBtn" value="Comment" />
</form>

然后由一位听众来统治所有人:

$(document).on("submit", '.commentForm', function(e){
    e.preventDefault();
     var comment_id = $(this).data('id');
     console.log('comment id = ',comment_id);
    $.ajax({
        type: 'POST',
        url: 'posts/' + comment_id + '/comment',
        //etc...
});

您可以执行以下步骤:

form中添加一个值为Listid的隐藏字段,如:

<input type="hidden" id="listId" value="{{$list->id}}" />

然后你可以在ajax调用中使用它,比如:

$listId = $("#listId").val();

以下是

  1. 创建隐藏输入
<input type="hidden" id="listid" name="listid" value="{{ $list->id }}">

并通过JQuery 读取该值

var listid = $('#listid').val();
  1. 创建一个JSON对象并在
<script>
   var list = {
      id : {{ $list->id }} //you can also add other variables in the object
     }
</script>

在js文件中使用列表对象

注意:在运行脚本之前,必须初始化列表对象

$.post('list/' + list.id + '/comment', data);