如何使用ajax发送到控制器？答案

【问题标题】：How to send the to controller with ajax?如何使用ajax发送到控制器？
【发布时间】：2021-10-23 08:40:43
【问题描述】：

如何向输入按钮添加代码，以便将 Id 的值发送到 Controller？

我有八张图片。然后我点击id为116，打开这张图片。

当我点击最大的照片时，为我打开一个引导模式。

此操作标签表单写入此 ID 120，而我选择了 ID 116。

http://localhost:8000/admin/products/4/galleries/120

@section('content')
    <div class="col-md-10 p-5 pt-2">
        <form method="post" action="{{ route('products.galleries.store', $product->id) }}" enctype="multipart/form-data" class="dropzone" id="dropzone">
            @csrf
        </form>
        <hr>
        <div class="col-md-6 mx-auto">
            <div class="row">
                <div class="mx-auto" id="showImage">
                    <img src="{{ asset("storage/{$gallery->image}") }}" class="img-fluid cursor-pointer" onclick="deleteImage('{{ $gallery->id }}', '{{ route('products.galleries.delete', [$product->id, $gallery->id]) }}')">
                </div>
            </div>
            <div class="row">
                @foreach($galleries as $gallery)
                    <div class="col-md-2">
                        <img src="{{ asset("storage/{$gallery->image}") }}" class="img-fluid cursor-pointer" onclick="showImage('{{ asset("storage/{$gallery->image}") }}', '{{ $gallery->id }}')"><br><div class="text-center text-danger">{{ $gallery->id }}</div>
                    </div>
                @endforeach
            </div>
        </div>
    </div>

    <div class="modal fade" id="delete" data-backdrop="static" data-keyboard="false" tabindex="-1" aria-labelledby="delete" aria-hidden="true">
        <div class="modal-dialog modal-sm">
            <form action="{{ route('products.galleries.delete', [$product->id, $gallery->id]) }}" method="post">
                @csrf
                <div class="modal-content">
                    <div class="modal-header">
                        <h5 class="modal-title">This action is not reversible.</h5>
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                            <span aria-hidden="true">&times;</span>
                        </button>
                    </div>
                    <div class="modal-body">
                        Are you sure you want to delete the image?
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
                        <button type="submit" class="btn btn-danger">Delete</button>
                    </div>
                </div>
            </form>
        </div>
    </div>

@endsection

@push('script')
    <script src="{{ asset('themes/js/dropzone.min.js') }}"></script>
    <script>
        function showImage(url, id) {
            let route = "'"+'{{ route('products.galleries.delete', [$product->id, $gallery->id]) }}'+"'";
            let image = '<img src='+url+' onclick="deleteImage('+id+','+route+')" class="img-fluid cursor-pointer" />';
            $('#showImage').html(image);
        }

        function deleteImage(id, url) {
            $('#delete').modal(id, url);
        }
    </script>
@endpush

【问题讨论】：

标签： php jquery ajax laravel

【解决方案1】：

您正在循环浏览图库图像，在循环迭代完成后，您为模态编写代码，用于模态的图库的最后一个值是您的图库图像集合中的最后一个索引。

这段代码可能会对你有所帮助

$gallery = 5;
$galleries = [5,6,7,9,8];
foreach($galleries as $gallery) {
    // code
}
// now your $gallery variable does not hold 5 instead it has 8 as you assigned its value through loop

由于您之前使用过 $gallery vairable，您可以像这样修复您的代码

@foreach($galleries as $_gallery)
    <div class="col-md-2">
         <img src="{{ asset("storage/{$_gallery->image}") }}" class="img-fluid cursor-pointer" onclick="showImage('{{ asset("storage/{$_gallery->image}") }}', '{{ $_gallery->id }}')"><br><div class="text-center text-danger">{{ $_gallery->id }}</div>
    </div>
@endforeach

【讨论】：