Не уверен, как передать идентификатор изображения, чтобы я мог использовать его в своем вызове ajax

Question

В настоящее время я пытаюсь внедрить систему голосования, чтобы пользователям могли нравиться или не нравиться загруженные изображения, однако я пытаюсь сделать это с помощью вызова ajax, что немного смущает меня.Я не уверен, как передать идентификатор изображения, которое нравится пользователю (на странице будет много изображений), в вызов ajax.В файле JavaScript data: imageId в настоящее время пуст, так как я не знаю, как точно определить и передать идентификатор изображения.

Домашний вид:

@extends('layouts.app')
@section('content')
    @foreach($images as $image)
        <div class='imageContainer'>
            <div class="stickyContainer blackGradient">
                <h1 class='imageTitle'>{{$image->name}}</h1>
                <img class='uploadedImg' src='{{url("storage/uploads/images/".$image->file_name)}}' alt='Random image'/>
                <a class='specialA' href='{{url("image/".$image->id)}}'></a>
                <div class='votingContainer'>
                    <a href='#'><div class='like'></div></a>
                    <a href='#'><div class='dislike'></div></a>
                </div>
            </div>
        </div>
    @endforeach
    <script>
        var token = '{{ Session:token() }}';
        var urlLike = '{{ route('like') }}';
    </script>
@endsection

Файл JavaScript:

$('.like').on('click', function(event){
        event.preventDefault();
        var isLike = event.target.previousElementSibling == null;
        console.log(isLike);
        $.ajax({
            method: 'POST',
            url: urlLike,
            data: {isLike: isLike, imageId: , _token: token}
        })
    });

Answer 1

Добавить атрибут данных со значением атрибута в качестве идентификатора изображения к элементу изображения, например data-imgId="1". Он должен быть уникальным для каждого элемента изображения.

<img class='uploadedImg' src='{{url("storage/uploads/images/".$image->file_name)}}' data-imgId="{{$image->id)}}" alt='Random image'/>

Затем получить идентификатор изображения с помощью приведенного ниже сценария

var imgId = $(this).parents('.stickyContainer').find('.uploadedImg').attr('data-imgId');

Answer 2

Назначьте идентификатор изображения для кнопки «Нравится» в представлении:

 <a href='#'><div class='like' id={{$image->id)}}></div></a>

Затем в javascript используйте идентификатор изображения для вызова ajax.

 imageId= event.target.id;

Примечание на стороне: ВЯ не понимаю, почему вы обнулите предыдущий брат с этим:

var isLike = event.target.previousElementSibling == null;