Laravel5.8で掲示板を作ってみる(5)

Laravel

かなり日が空きましたが、前回で新規投稿するところが完成したので、
今回は投稿した掲示板を表示して、レスを返すところまでやってみます!

詳細表示ページ作成

詳細ページ作成のために下記コントローラーを新規作成しました。
indexで詳細ページの表示用のデータを取って表示しています。
makeResponseはレスを返すときの保存処理です。保存した後に同じ掲示板にリダイレクトしています。

namespace App\Http\Controllers;

use App\Board;
use App\Message;
use Illuminate\Database\Eloquent\Collection;
use Illuminate\Http\Request;

class DetailPage extends Controller
{
    public function index(Request $request)
    {   
        /** @var Board|Collection $board */
        $board = new Board();
        $board_data = $board::find($request->id);

        /** @var Message|Collection $message */
        $message = new Message();
        $messages = $message::where('board_id', '=', $request->id)->get();

        return view("show_bbs", ['board' => $board_data, 'messages' => $messages]);
    }   

    public function makeResponse(Request $request)
    {   
        $message = new Message();
        $message->fill([
            'board_id' => $request->board_id,
            'user_name' => $request->user_name,
            'message' => $request->message
        ])->save();

        return redirect()->route("detail.index", ["id" => $request->board_id]);
    }   
}                                                                                                                                                                                                                                                                                   

ルート(web.php)を修正する

ルーティングを修正して、表示とレスの登録ができるようにしました。

Route::get('/detail', 'DetailPage@index')->name("detail.index");                                                                                                                                                                                                                    
Route::post('/detail/response', 'DetailPage@makeResponse')->name("detail.response");                                                                                                                                                                                                

Viewを修正する

投稿内容を表示している箇所は省略します(笑)
渡したboardとmessagesをforeachやらを使って表示するようにしています。

<div class="fixed-bottom">                                                                                                                                                                                                                                                          
    <form method="post" action="{{ route("detail.response") }}">                                                                                                                                                                                                                    
        @csrf                                                                                                                                                                                                                                                                       
        <input type="hidden" name="board_id" value="{{ $board->id }}"/>                                                                                                                                                                                                             
        <div class="card mt-3">                                                                                                                                                                                                                                                     
            <div class="card-body">                                                                                                                                                                                                                                                 
                <div class="form-inline">                                                                                                                                                                                                                                           
                    <label class="col-form-label">名前</label>                                                                                                                                                                                                                      
                    <input type="text" name="user_name" class="form-control ml-2 col-5"/>
                </div>
                <div class="form-inline mt-2">
                    <label class="col-form-label">内容</label>
                    <textarea name="message" class="form-control ml-2 col-10"></textarea>
                </div>
                <div class="justify-content-center mt-2">
                    <button type="submit" class="btn btn-primary mx-auto d-block col-3">投稿</button>
                </div>
            </div>
        </div>
    </form>
</div>

レスを返すところを上記のように書いています。
@csrfはcsrf対策のために入っています。これがないとPOSTでエラーになるので、忘れずに入れるようにする必要があります。
あとは普通のフォームの感じで書いて、actionに”detail.response”を指定してmakeReponse関数が動くように設定しています。

掲示板一覧にリンクを付ける

トップの一覧から表示できるように、掲示板にリンクを付けました。
掲示板のIDを渡して、それぞれの掲示板を判断してます。

 <div class=" d-flex justify-content-between">
     <a href="{{ route('detail.index', ["id" => $board->id]) }}">{{ $board->title }}</a>
     <small>{{ date_format($board->created_at, 'Y/m/d') }}</small>
 </div>

動作確認

タイトルのところがリンクになります。

投稿が表示されるので、レスを入力して投稿します。

再度同じページが表示されて、投稿されてることが確認できました。

ここまでをこちら(example5)においています。

コメント

タイトルとURLをコピーしました