带有HTML表单的Laravel删除按钮

kadbb459  于 2023-01-21  发布在  其他
关注(0)|答案(5)|浏览(121)

我用的是HTML格式,不是Laravel Collective.
现在我已经成功地在CMS中为用户创建了一个CRUD,但是有一件事困扰着我:
如何在我的用户列表中设置“删除”按钮,而不是在特定的编辑页面中设置?
此外,当用户单击删除按钮显示删除特定用户的确认弹出窗口时,这将是很好的。
下面是我的代码:
控制器:

/**
 * Remove the specified resource from storage.
 *
 * @param  int  $id
 * @return \Illuminate\Http\Response
 */
public function destroy($id)
{
    $user = User::findOrFail($id);
    $user->delete();

    return redirect('/admin/users'); 
}

用户列表页面:

@extends('layouts.backend')

@section('content')
  <h1>Users</h1>
  <a class="btn btn-primary" href="/admin/users/create">Create new user</a>
  <table class="table">
    <thead>
      <tr>
        <th>Id</th>
        <th>Name</th>
        <th>Email</th>
        <th>Role</th>
        <th>Status</th>
        <th>Created</th>
        <th>Updated</th>
        <th>Operations</th>
      </tr>

    </thead>
    <tbody>
      @if($users)
        @foreach($users as $user)
          <tr>
            <td>{{$user->id}}</td>
            <td>{{$user->name}}</td>
            <td>{{$user->email}}</td>
            <td>{{$user->role ? $user->role->name : 'User has no role'}}</td>
            <td>{{$user->status == 1 ? 'Active' : 'Not active'}}</td>
            <td>{{$user->created_at->diffForHumans()}}</td>
            <td>{{$user->updated_at->diffForHumans()}}</td>
            <td>
              <a href="/admin/users/{{$user->id}}/edit" class="btn btn-primary">Edit</a>
              <a class="btn btn-danger" href="">Delete</a> // HOW TO ACHIEVE THIS?
            </td>
          </tr>
        @endforeach
      @endif
    </tbody>
  </table>

@endsection

特定编辑用户页面:

@extends('layouts.backend')

@section('content')
  <h1>Edit user</h1>
  <form method="POST" action="/admin/users/{{$user->id}}">
    {{ csrf_field() }}
    {{ method_field('PATCH') }}

    <div class="form-group">
      <label>Name:</label>
      <input type="text" name="name" class="form-control" value="{{$user->name}}">
    </div>

    <div class="form-group">
      <label>Email:</label>
      <input type="text" name="email" class="form-control" value="{{$user->email}}">
    </div>

    <div class="form-group">
      <label>Role:</label>
      <select name="role_id" class="form-control">
        @if($user->role_id == 1)
          <option value="1" selected>Administrator</option>
          <option value="2">Editor</option>
        @else
          <option value="1">Administrator</option>
          <option value="2" selected>Editor</option>
        @endif
      </select>
    </div>

    <div class="form-group">
      <label>Status:</label>
      <select name="status" class="form-control">
        @if($user->status == 1)
          <option value="1" selected>Active</option>
          <option value="0">Not active</option>
        @else
          <option value="1">Active</option>
          <option value="0" selected>Not active</option>
        @endif
      </select>
    </div>

    <div class="form-group">
      <label>Password</label>
      <input type="password" name="password" class="form-control" value="{{$user->password}}">
    </div>

    <div class="form-group">
      <input type="submit" name="submit" value="Update user" class="btn btn-primary">
    </div>
  </form>

  <form id="delete-form" method="POST" action="/admin/users/{{$user->id}}">
    {{ csrf_field() }}
    {{ method_field('DELETE') }}

    <div class="form-group">
      <input type="submit" class="btn btn-danger" value="Delete user">
    </div>
  </form>

  @include('inc.errors')
@endsection

路线:

Route::group(['middleware'=>'admin'], function(){
     Route::resource('admin/users', 'AdminUsersController');

     Route::get('/admin', function(){
       return view('admin.index');
     });
    // Route::resource('admin/posts', 'AdminPostsController');
});
0mkxixxg

0mkxixxg1#

从您发布的代码中看不出来,但是您的DELETE路由需要DELETE方法,这是应该的!
但是在你的列表中,你试图用GET方法访问它。
实际上,您应该重用编辑页面中的代码,它已经伪造了DELETE方法。
大概是这样的

...
<td>
    <a href="/admin/users/{{$user->id}}/edit" class="btn btn-primary">Edit</a>
    <form method="POST" action="/admin/users/{{$user->id}}">
        {{ csrf_field() }}
        {{ method_field('DELETE') }}

        <div class="form-group">
            <input type="submit" class="btn btn-danger delete-user" value="Delete user">
        </div>
    </form>
</td>
...

...
// Mayank Pandeyz's solution for confirmation customized for this implementation
<script>
    $('.delete-user').click(function(e){
        e.preventDefault() // Don't post the form, unless confirmed
        if (confirm('Are you sure?')) {
            // Post the form
            $(e.target).closest('form').submit() // Post the surrounding form
        }
    });
</script>
roqulrg3

roqulrg32#

正如你所说的当用户点击Delete按钮来显示删除特定用户的确认弹出窗口时会很好。为此,你必须使用jqueryajax。更改以下代码:

<a class="btn btn-danger" href="">Delete</a>

<a class="btn btn-danger delete_user" href="javascript:void(0);" id="{{$user->id}}">Delete</a>

并放置一个事件侦听器,如:

$('.delete_user').click(function(){
  if( confirm('Are you sure?') )
  {
    var id = $(this).attr('id');
    // Make an ajax call to delete the record and pass the id to identify the record
  }
});
vwkv1x7d

vwkv1x7d3#

您可以更新代码,如下所示:

<a class="btn btn-danger" href="/admin/users/{{$user->id}}/delete" >Delete</a>

或者您应该删除使用路由名称的用户,例如:

<a href="{{ route('admin.user.delete', [$user->id]) }}" class="btn btn-xs btn-danger" onclick="return confirm('Are you sure?')">Delete</a>
57hvy0tb

57hvy0tb4#

带有“laravel表单助手”和jquery的选项

<div class="actions">
    <a href="#" class="list-icons-item delete-action">
        <i class="icon-trash"></i>
    </a>
    {{ Form::open(['url' => route('admin.users.destroy', $user), 'method' => 'delete']) }}
    {{ Form::close() }}
</div>

<script>
    $(document).ready(function () {
        $('.delete-action').click(function (e) {
            if (confirm('Are you sure?')) {
                $(this).siblings('form').submit();
            }

            return false;
        });
    });
</script>
qzlgjiam

qzlgjiam5#

使用闭合路径删除
show.blade.php

<form>
<h1>Title: {{$tutorial->title}}</h1>
<p>Title Description: {{$tutorial->title_description}}</p>
<p>Video: {{$tutorial->video}}</p>
<form action="{{ route('delete-tutorial', [$tutorial->id])}}" 
method="post">
@csrf
@method('DELETE')
<button class="btn btn-primary" onclick="return confirm('Are you sure?')" 
type="submit" name="Delete">Delete</button>
</form>

对于要删除的路由

Route::delete('tutorial/{id}',function($id){
$tutorial = Tutorial::findOrFail($id)->first();
$tutorial->delete();
return redirect('tutorial'); 
})->name('delete-tutorial');

也别忘了把这个添加到你的routes/web.php

use App\Models\Tutorial;

相关问题