todo作成画面の作成

今回はtodo の作成画面を作っていきます。

Controller の編集


class todoController extends Controller
{
  public function add()
  {
      return view('todo.create');
  }

  // 以下を追記
  public function create(Request $request)
  {
      // todo/createにリダイレクトする
      return redirect('todo/create');
  }  
}

Routing の編集


web.php を以下のように編集して下さい。

Route::group(['middleware' => 'auth'], function() {
    Route::get('todo/create', 'Admin\TodoController@add');
    Route::post('todo/create', 'Admin\TodoController@create'); //追記
});

Route::group() について説明します。

これは文字通りルーティング情報をグループ化したい時に使います。

今回はなぜグループ化したかというと、このグループ化させているルーティング全てに “ログインしていなかったらログイン画面にリダイレクトする” という処理を適用させたいからです。

一行一行全てに auth をかけていてはとても面倒なので今回は Route::group を使いました。

便利なので覚えておきましょう。

View の編集


view を編集していくことにします。

先ほど createアクションでリダイレクトをかけた create.blade.php を以下のように編集して下さい。

@extends('layouts.layout')
@section('title', 'todoの新規作成')

@section('content')
    <div class="container">
        <div class="row">
            <div class="col-md-8 mx-auto">
                <h2>todo新規作成</h2>

                <form action="{{ action('Admin\TodoController@create') }}" method="post" enctype="multipart/form-data">

                    @if (count($errors) > 0)
                        <ul>
                            @foreach($errors->all() as $e)
                                <li>{{ $e }}</li>
                            @endforeach
                        </ul>
                    @endif
                    <div class="form-group row">
                        <label class="col-md-2" for="title">タイトル</label>
                        <div class="col-md-10">
                            <input type="text" class="form-control" name="title" value="{{ old('title') }}">
                        </div>
                    </div>
                    <div class="form-group row">
                        <label class="col-md-2" for="space">場所</label>
                        <div class="col-md-10">
                            <input type="text" class="form-control" name="space" value="{{ old('space') }}">
                        </div>
                    </div>
                    <div class="form-group row">
                        <label class="col-md-2" for="deadline">期限</label>
                        <div class="col-md-10">
                            <input type="date" class="form-control" name="deadline" value="{{ old('deadline') }}">
                        </div>
                    </div>

                    <div class="form-group row">
                        <label class="col-md-2" for="priority">重要度</label>
                        <div class="col-md-10">
                          <select class="form-control" name="priority" min="1" max="5" value="{{ old('priority') }}">
                            <?php
                            for ($i = 1; $i <=5; $i++) {
                               print ('<option value="' . $i. '">' . $i . '</option>');
                               }
                               ?>
                            </select>
                        </div>
                    </div>


                    {{ csrf_field() }}
                    <input type="submit" class="create-btn" value="登録">
                </form>
            </div>
        </div>
    </div>
@endsection

 

ここまでできたらサーバーを起動して、http://localhost:8000/todo/create にアクセスしてみましょう。

こんな感じである程度見た目の整った画面が表示されるはずです。

実際に送信することは可能ですが、まだデータベースの処理を書いていないので何も起こりません。

カテゴリー

アーカイブ

Close Bitnami banner
Bitnami