laravelを使用したTodoリストにて削除機能を実装したい。

Question

#実現したいこと
laravelを使用したTodoリストにて削除ボタンを押した際にタスクを削除して一覧表示に反映させたい。

#やったこと
下記コードを試してみました。自分で色々調べてみましたがどの方法も上手く行きませんでした。

#問題点
まず/delにURLが変わらない。
削除出来ない。

ヒントでも何でも良いので、気づいた点がありましたらご指摘頂けると大変嬉しいです。

#環境
laravel 6
mysql 8

Todo.php

<?php

namespace App;

use Illuminate\Database\Eloquent\Model;

class Todo extends Model
{
    protected $table = 'Todos';
    protected $guarded = array('id');

    public static $rules = array(
        'comment' => 'required'
    );
}

TodoController.php

<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;
use App\Http\Requests\CreateTaskRequest;
use Illuminate\Support\Facades\DB;
use App\Todo;

class TodoController extends Controller
{
  public function index(Request $request)
  {
    $items = Todo::all();
    return view('Todos.index', ['items' => $items]);
  }

  public function create(CreateTaskRequest $req)
  {
    $todo = new Todo;
    $form = $request->all();
    unset($form['_token']);
    $todo->timestamps = false;
    $todo->fill($form)->save();
    $param = [
      'id' => $req->id,
      'comment' => $request->comment,
    ];

    return redirect('/Todo');
  }
  public function delete(Request $request)
  {
    Todo::find($request->id)->delete();
    return redirect('/Todo');
  }
}

web.php

Route::get('/Todo', 'TodoController@index');
Route::post('/Todo', 'TodoController@create');
Route::group(['middleware' => ['web']], function () {
    Route::post('/Todo', 'TodoController@create');
});
Route::post('Todo/del', 'TodoController@delete');

views/Todos/index.blade.php

@extends('layouts.index')
@section('title','Todoリスト')
@section('menubar')
@parent
Todoリスト
@endsection

@section('content')


<table>
  <form action="/Todo" method="post">
    {{ csrf_field() }}
    <tr>
      <th>ID</th>
      <th>comment</th>
      <th>状態</th>
    </tr>
    @foreach ($items as $item)
    <tr>
      <td>{{$item->id}}</td>
      <td>{{$item->comment}}</td>
      <td>作業中</td>
      <td>
        <form action="/Todo/del" method="post">
          <button type="button" name="delete" value="value">削除</button>
      </td>
    </tr>
    @endforeach
  </form>
</table>
@endsection

Answer 1

formは入れ子にできません。

Comments

[twinparadox]

ご指摘ありがとうございます！

Answer 2

TodoController

<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;
use App\Http\Requests\CreateTaskRequest;
use Illuminate\Support\Facades\DB;
use App\Todo;

class TodoController extends Controller
{
  public function index(Request $request)
  {
    $items = Todo::all();
    return view('Todos.index', ['items' => $items]);
  }

  public function create(CreateTaskRequest $request)
  {
    $todo = new Todo;
    $form = $request->all();
    unset($form['_token']);
    $todo->timestamps = false;
    $todo->fill($form)->save();
    $param = [
      'id' => $request->id,
      'comment' => $request->comment,
    ];

    return redirect('/Todo');
  }
  public function delete(Request $request)
  {
    Todo::find($request->table)->delete();
    return redirect('/Todo');
  }
}

web.php

<?php

/*
|--------------------------------------------------------------------------
| Web Routes
|--------------------------------------------------------------------------
|
| Here is where you can register web routes for your application. These
| routes are loaded by the RouteServiceProvider within a group which
| contains the "web" middleware group. Now create something great!
|
*/

Route::get('/', function () {
    return view('welcome');
});


Route::get('/Todo', 'TodoController@index');
Route::post('/Todo', 'TodoController@create');
Route::group(['middleware' => ['web']], function () {
    Route::post('/Todo', 'TodoController@create');
});
Route::delete('/Todo/{table}', 'TodoController@delete');

view/Todos/index.blade.php

@extends('layouts.index')
@section('title','Todoリスト')
@section('menubar')
@parent
Todoリスト
@endsection

@section('content')


<table>
  <tr>
    <th>ID</th>
    <th>コメント</th>
    <th>状態</th>
  </tr>
  @foreach ($items as $item)
  <tr>
    <td>{{$item->id}}</td>
    <td>{{$item->comment}}</td>
    <td>作業中</td>
    <td>
      <form action="{{ url('Todo/' . $item->id) }}" method="POST">
        @csrf
        @method('DELETE')

        <button type="submit" class="btn btn-danger">
          <i class="fa fa-btn fa-trash"></i> 削除
        </button>
      </form>
    </td>
  </tr>
  @endforeach
</table>
@endsection

Comments

[m.ts10806]

TodoControllerが２つ貼られています

[twinparadox]

修正しました。