--> -->

skimemo

Laravel-20190211

_ Laravelのresrouceで確認画面を作る

LaravelのリソースコントローラはCRUDの一通りの流れのrouteを一行で記述できるのでとても便利です。
しかし、少ないURLバリエーションの中でアクションとの組み合わせで各種動作を実現しているため、標準では用意されていない確認画面のようなものを挟むには少しコツが必要です。

今回は私が試行錯誤しながらたどり着いた確認画面の作り方です。

  1. やりたいこと
    「create→確認画面→store」という風に、新規登録画面の次に確認画面を挟みます。

  2. 前提条件
    • 確認画面はGETでないといけません。storeでvalidationエラーになった場合にback()でリダイレクトするのですが、POSTに対してはリダイレクトできないためです。
    • 確認画面へはPOSTで遷移したいです（上と矛盾してる・・・(笑)）。createで入力された内容に長い文章が入る可能性があり、GETだとURLの長さ制限にひっかかる恐れがあるためです。

  3. できれば実現したいこと
    • createとconfirmフォームは分けたいです。確かにフォーマットはほぼ同じですが、役割が違いますしViewの中にif文が細々入るのはなるべく避けたいものです。
    • routeは増やしたくないです。折角resource使っているので・・・。

  4. 実現方法
    こちら*1のページを参考に、以下の流れで作ってみます。参考ページはvalidationを活用してcreateへ戻していますが、個人的に細かいファイルが沢山増えると煩雑になる（←前時代的・・・）のと、エラーじゃないのにvalidationで戻すのに抵抗があったのでcontrollerでback()で戻します。
    create → (store→リダイレクト→create(confirm)) → store

これであれば、createから次の画面へはpostで遷移します(前提条件2)が、確認画面はgetの画面(前提条件1)です。createが二役担っているので新たなrouteを用意する必要もありません。かといってcreateフォームがconfirmを兼用しているわけでは無く、confirmフォームは別に用意できています。

↑

_ createフォーム 

  1
  2
  3
  4
  5
  6
  7

(前略)
{{Form::open(['url'=>route('path.store')])}}
(中略)
{{Form::textarea('message')}}
{{Form::button('次へ',['type'=>'submit','name'=>'action','value'=>'confirm'])}}
{{Form::close()}}
(後略)

※ buttonにactionとvalueを設定することでstoreにcofirm指示を渡します。

↑

_ confirmフォーム 

  1
  2
  3
  4
  5
  6
  7
  8
  9
 10
 11
 12
 13
 14
 15
 16
 17
 18
 19
 20
 21

(前略)
<script>
    /**
     * 前画面に戻る
     */
    function goBack(){
        document.forms.form.action = '{{route('path.create')}}';
        document.forms.form._method.value = 'get';
        document.forms.form.submit();
    }
</script>
(中略)
{{Form::open(['name'=>'form','url'=>route('path.store')])}}
{{Form::hidden('_method','post')}}    {{--goBack()で書き換えに使用する--}}
(中略)
{{old('message')}}
{{Form::hidden('message',old('message'))}}
(中略)
{{Form::button('前に戻る',['onclick'=>'goBack();'])}}
{{Form::button('登録する',['type'=>'submit','name'=>'action','value'=>'submit'])}}
(後略)

※ goBack()はただcreateへ遷移するだけですが、これで入力内容も再現されます。

↑

_ コントローラ 

  1
  2
  3
  4
  5
  6
  7
  8
  9
 10
 11
 12
 13
 14
 15
 16
 17
 18
 19
 20
 21
 22
 23

public function create(){
    if(session()->has('confirm')){
        // storeからback()してきた場合
        return view()->make('confirm');
    } else {
        return view()->make('create');
    }
}
 
public function store(Request $request){
 
    // validaion実行
 
    // [確認]ボタンなら確認フォーム表示へ
    $action = $request->input('action');
    if($action=='confirm'){
        return redirect()->back()->withInput()->with('confirm',true);
    }
 
    // 登録処理実行
 
    return view()->make('store');    // 「登録しました」画面
}


resrouceってどうして確認画面無いんでしょうね。欧米的には「まずはやっちゃえ」なのかな・・・(笑)

リソース・・・(笑)


[商品価格に関しましては、リンクが作成された時点と現時点で情報が変更されている場合がございます。]

ヒシウメ　タマリソース　10L
価格：3880円（税込、送料別) (2019/2/11時点)

 

*1

Laravel 5で確認画面付き問い合わせフォームを作る
https://qiita.com/ponko2/items/fd7ac38b964e10f16f52


Last-modified: 2019-05-25 (土) 16:52:59 (1789d)