Отправка формы с использованием атрибутов данных

Question

Пожалуйста, я хочу удалить конкретную запись на основе ее data-id как: data-id="delete-form-{{ $position->id }}, но каждый раз, когда я пытаюсь это сделать, всегда возвращает идентификатор последней записи и даже не могу удалить.

ниже мой код

@forelse ($pos as $position)
               <tr>
                <td>{{ $loop->index+1 }}</td>
                <td>{{ $position->name }}</td>
                <td>{{ $position->created_at->diffForHumans() }}</a></td>
                <td><a class="btn btn-warning" href="{{ route('position.edit', $position->id) }}"><i class="fa fa-fw fa-lg fa-edit"></i>Edit</a></td>
                <td>
                    <form data-id="delete-form-{{ $position->id }}" action="{{ route('position.destroy', $position->id) }}" method="POST" style="display:none">
                        @csrf
                        @method('DELETE')
                    </form>
                    <a class="posSwal btn btn-sm btn-danger" href="" onclick="isConfirm()">
                     <i class="fa fa-fw fa-lg fa-times-circle"></i>Delete</a>
                    </td>
            </tr>

            @empty
            <p>No Record available</p>
            @endforelse

JavaScript

 <script>
$('.posSwal').click(function(){ 
    event.preventDefault();
    swal({
        title: "Are you sure?",
        text: "You will not be able to recover this imaginary file!",
        type: "warning",
        showCancelButton: true,
        confirmButtonText: "Yes, delete it!",
        cancelButtonText: "No, cancel plx!",
        closeOnConfirm: false,
        closeOnCancel: false
    }, function(isConfirm) {
        if (isConfirm) {
            $("form").data("id").submit();
            swal("Deleted!", "Your imaginary file has been deleted.", "success");
        } else {
            swal("Cancelled", "Your imaginary file is safe :)", "error");
        }
    });
});

Answer 1

, но всякий раз, когда я пытаюсь это сделать, всегда возвращает идентификатор последней записи и даже не могу удалить.

Это происходит потому, что вы не ссылаетесь на текущий элемент привязки, на который нажали.В вашем обработчике кликов вы можете сохранить текущую привязку перед warnDefault:

let ele = this;

, а в вашей ласточке вы можете вычислить текущий идентификатор и URL, чтобы использовать ajax вместо отправки формы:

var id = $(ele).closest('td').find("form").data("id");
var url =  $(ele).closest('td').find("form").attr('action');
$.post(url, { id:  id });

function isConfirm() {

}

$('.posSwal').on('click', function(e){
    event.preventDefault();
    let ele = this;
    swal({
        title: "Are you sure?",
        text: "You will not be able to recover this imaginary file!",
        type: "warning",
        showCancelButton: true,
        confirmButtonText: "Yes, delete it!",
        cancelButtonText: "No, cancel plx!",
        closeOnConfirm: false,
        closeOnCancel: false
    }, function(isConfirm) {
        if (isConfirm) {
            var id = $(ele).closest('td').find("form").data("id");
            var url =  $(ele).closest('td').find("form").attr('action');
            console.log('current id is: ' + id);
            $.post(url, { id:  id });
            swal("Deleted!", "Your imaginary file has been deleted.", "success");
        } else {
            swal("Cancelled", "Your imaginary file is safe :)", "error");
        }
    });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/lipis/bootstrap-sweetalert@master/dist/sweetalert.css">
<script src="https://cdn.jsdelivr.net/gh/lipis/bootstrap-sweetalert@master/dist/sweetalert.min.js"></script>


<table>
    <tbody>
    <tr>
        <td>{{ $loop->index+1 }}</td>
        <td>{{ $position->name }}</td>
        <td>{{ $position->created_at->diffForHumans() }}</a></td>
        <td><a class="btn btn-warning" href="{{ route('position.edit', $position->id) }}"><i class="fa fa-fw fa-lg fa-edit"></i>Edit</a></td>
        <td>
            <form data-id="delete-form-1" action="{{ route('position.destroy', $position->id) }}" method="POST" style="display:none">
                @csrf
                @method('DELETE')
            </form>
            <a class="posSwal btn btn-sm btn-danger" href="" onclick="isConfirm()">
                <i class="fa fa-fw fa-lg fa-times-circle"></i>Delete</a>
        </td>
    </tr>
    <tr>
        <td>{{ $loop->index+1 }}</td>
        <td>{{ $position->name }}</td>
        <td>{{ $position->created_at->diffForHumans() }}</a></td>
        <td><a class="btn btn-warning" href="{{ route('position.edit', $position->id) }}"><i class="fa fa-fw fa-lg fa-edit"></i>Edit</a></td>
        <td>
            <form data-id="delete-form-2" action="{{ route('position.destroy', $position->id) }}" method="POST" style="display:none">
                @csrf
                @method('DELETE')
            </form>
            <a class="posSwal btn btn-sm btn-danger" href="" onclick="isConfirm()">
                <i class="fa fa-fw fa-lg fa-times-circle"></i>Delete</a>
        </td>
    </tr>
    </tbody>
</table>