Question

我有一个视图，显示数据库中的用户表，最后一列有删除按钮，目前我可以正常工作，但我想显示确认模型，当用户点击删除按钮时，它将删除选择使用

这是删除按钮的当前代码，工作正常：

<a href="{{ route('deleteUser', ['user_id' => $user->id]) }}"><button type="button" class="btn mr-0 mb-0 btn-outline-primary btn-sm"><i class="icon-trash3"></i></button></a>

现在我使用了这个模型，我必须点击删除按钮才能删除所选用户

<div class="modal fade text-xs-left" id="iconModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel2" aria-hidden="true">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
                <h4 class="modal-title" id="myModalLabel2"><i class="icon-warning2"></i> Confirmation Message</h4>
            </div>
            <div class="modal-body">
                <p>Are you sure that you want to <strong>Delete</strong> this user ?</p>

            </div>
            <div class="modal-footer">
                <button type="button" class="btn grey btn-outline-secondary" data-dismiss="modal">Close</button>
                <button type="button" class="btn btn-outline-primary">Delete</button>
            </div>
        </div>
    </

Answer 1

您无需为每个用户生成模态。只需构建一个模态并使用动态部件的数据属性。

因此，作为最小值，使用每个按钮的数据属性，例如 data-user-id =＆＃34; {{}}＆＃34;在表单操作中使用：

<a href="#" class="btn mr-0 mb-0 btn-outline-primary btn-sm" data-toggle="modal" data-target="#deleteUserConfirmation" data-user-id="{{ $user->id }}"><i class="icon-trash3"></i></a>

在模态窗口中使用带删除方法的表单：

<form id="deleteUserForm" method="POST">
{{ method_field("DELETE") }}
<button class="btn btn-danger" type="submit">DELETE</button>
</form>

在脚本使用中：

<script>
  $('#deleteUserForm').on('show.bs.modal', function (event) {
  var button = $(event.relatedTarget);
  $('#deleteUserForm').attr('action', '/user/' + button.data('user-id'));
});
</script>

在路线使用中：

Route::delete('/user/{user}', 'UserController@destroy');

P.S。您还可以使用动态使用的其他数据属性，例如data-user-name =＆＃34; {{}}＆＃34;显示用户的姓名将被删除。

Answer 2

好的，我已经使用下面的方法使其工作，但是需要为每个删除按钮创建一个模态，所以我认为这不是一个很好的后端解决方案可能有超过1k用户甚至200k用户所以我希望这在循环外的模态时工作吗？

@foreach ($users as $user)
<tr>
    <th scope="row">{{ $loop->index + 1 }}</th>
    <td>{{ $user->fullname }}</td>
    <td>{{ $user->username }}</td>
    <td>{{ $user->email }}</td>
    <td>
        @foreach( $roles as $role ) {{ $user->role_id == $role->id ? $role->name : ''}} @endforeach
    </td>
    <td>
        <a href="{{ route('dUseInfo', [$user->id]) }}">
            <button type="button" class="btn mr-0 mb-0 btn-outline-primary btn-sm"><i class="icon-settings2"></i></button>
        </a>
        <button type="button" class="btn mr-0 mb-0 btn-outline-primary btn-sm" data-toggle="modal" data-target="#iconModal-{{ $user->id }}"><i class="icon-trash3"></i></button>

        <!-- Modal -->
        <div class="modal fade text-xs-left" id="iconModal-{{ $user->id }}" tabindex="-1" role="dialog" aria-labelledby="myModalLabel2" aria-hidden="true">
            <div class="modal-dialog" role="document">
                <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                            <span aria-hidden="true">&times;</span>
                        </button>
                        <h4 class="modal-title" id="myModalLabel2"><i class="icon-warning2"></i> Confirmation Message</h4>
                    </div>
                    <div class="modal-body">
                        <p>Are you sure that you want to <strong>Delete</strong> this user ?</p>

                    </div>
                    <div class="modal-footer">
                        {!! Form::open(['route' => ['deleteUser', $user->id], 'class' => 'delete', 'method' => 'DELETE']) !!}
                        <button type="button" class="btn grey btn-outline-secondary" data-dismiss="modal">Close</button>
                        <button type="submit" class="btn btn-outline-primary">Delete</button>

                        {!! Form::close() !!}

                    </div>
                </div>
            </div>
        </div>
    </td>
</tr>
@endforeach

（Laravel）删除按钮上的确认模型

2 个答案: