:::

14-2 修改題目

一、修改路由

  1. 修改路由 /專案/routes/web.php 加入topic 的 edit 路由,一樣使用路由模型綁定,{topic}就是編號,放在前後其實都沒關係。
    Route::pattern('exam', '[0-9]+');
    Route::pattern('topic', '[0-9]+');
    //略
    Route::get('/topic/{topic}/edit', 'TopicController@edit')->name('topic.edit');

二、修改樣板,加入編輯按鈕

  1. 修改原來的 /專案/resources/views/exam/show.blade.php 樣板,加入編輯按鈕:

    <h3>
    @can('建立測驗')
        <a href="{{route('topic.edit', $topic->id)}}" class="btn btn-warning">編輯</a>
        ({{$topic->ans}})
    @endcan
    {{ bs()->badge()->text($key+1) }}
    {{ $topic->topic }}
    </h3>
  2. 如:

三、修改Topic控制器

  1. 要修改題目,會遇到和修改測驗一樣的問題(而且更複雜一點),因為是共用樣板,所以,必須針對「建立」和「修改」兩種情形來修改部份視圖的設定

    • 建立的http動詞是post,修改則是patch(如此,會自動加上CSRF保護,避免跨站攻擊)

    • 建立題目的表單action/topic,修改題目則是/topic/編號

  2. 在控制器中 /專案/app/Http/Controllers/TopicController.php,加入 edit 的方法:

    public function edit(Topic $topic)
    {
        $exam   = $topic->exam;
        return view('exam.show', compact('exam', 'topic'));
    }
    • 主要就是讀出題目$topic 的原始內容,以便套用到表單中。我們將Topic注入$topic$topic就成了一個Topic內容物件

    • 此外,測驗內容$exam也會被用到,用來顯示測驗標題,而且因為我們已經有設好關聯,所以,不用另外抓,$topic->exam就是所屬測驗的完整資料。

  3. 最後,修改 /專案/resources/views/exam/show.blade.php 樣板:

    @can('建立測驗')
        @if(isset($topic))
            {{ bs()->openForm('patch', "/topic/{$topic->id}", ['model' => $topic]) }}
        @else
            {{ bs()->openForm('post', '/topic') }}
        @endif
            {{ bs()->formGroup()
                    ->label('題目內容', false, 'text-sm-right')
                    ->control(bs()->textarea('topic')->placeholder('請輸入題目內容'))
                    ->showAsRow() }}
            {{ bs()->formGroup()
                    ->label('選項1', false, 'text-sm-right')
                    ->control(bs()->text('opt1')->placeholder('輸入選項1'))
                    ->showAsRow() }}
            {{ bs()->formGroup()
                    ->label('選項2', false, 'text-sm-right')
                    ->control(bs()->text('opt2')->placeholder('輸入選項2'))
                    ->showAsRow() }}
            {{ bs()->formGroup()
                    ->label('選項3', false, 'text-sm-right')
                    ->control(bs()->text('opt3')->placeholder('輸入選項3'))
                    ->showAsRow() }}
            {{ bs()->formGroup()
                    ->label('選項4', false, 'text-sm-right')
                    ->control(bs()->text('opt4')->placeholder('輸入選項4'))
                    ->showAsRow() }}
            {{ bs()->formGroup()
                    ->label('正確解答', false, 'text-sm-right')
                    ->control(bs()->select('ans',[1=>1, 2=>2, 3=>3, 4=>4])->placeholder('請設定正確解答'))
                    ->showAsRow() }}
            {{ bs()->hidden('exam_id', $exam->id) }}
            {{ bs()->formGroup()
                    ->label('')
                    ->control(bs()->submit('儲存'))
                    ->showAsRow() }}
        {{ bs()->closeForm() }}
    @endcan
  4. 到此就大功告成啦!
  5. 最後,只要完成「更新」部份的功能即可。

到GitHub觀看此單元程式異動


:::

書籍目錄

展開 | 闔起

快速登入


http%3A%2F%2Fcampus-xoops.tn.edu.tw%2Fmodules%2Ftad_book3%2Fpage.php%3Ftbdsn%3D1186%26tbsn%3D37

計數器

今天: 1543154315431543
昨天: 2665266526652665
總計: 8074980807498080749808074980807498080749808074980