Edited at

LaravelでFromに遷移してきた時のRadioのデフォルト値の設定とSubmitで弾かれた時のRadioの値の維持

More than 1 year has passed since last update.


前提

好きな食べものとして、AppleかBananaかを選ぶラジオボックスがあるとする。

「Banana」を選択してた状態でsubmitしたが、他の必須項目で未入力があり登録が完了せず戻ってきた際に「Banana」の選択状態が解除されていたので維持したい。

ついでに、このFormにきた際はデフォルトでAppleを選択状態にしておきたい。


使う関数

old()

old()に関して


Laravel also provides a global old helper. If you are displaying old input within a Blade template, it is more convenient to use the old helper. If no old input exists for the given field, null will be returned:


<input type="text" name="username" value="{{ old('username') }}">

参考URL

Accessing The Request


普通にold()を書くだけだと

<input type="radio" name="like" id="apple" value='apple' {{ old('like') == 'apple' ? 'checked' : '' }}>

<label for="apple">Apple</label>

<input type="radio" name="like" id="banana" value='banana' {{ old('like') == 'banana' ? 'checked' : ''}}>
<label for="banana">Banana</label>

見たら分かるかもしれないが

{{ old('like') == 'apple' ? 'checked' : '' }}

formをsubmitしてValidateでの戻ってきた際にセッションのフラッシュデータと比較して同じであればchecked状態にするのだが

これだけだとFormページに遷移された時にどちらも選択されていない状態である

jsでcheckedにすることも可能だがlaravelだけで済ませたい場合はold()に第2引数としてデフォルト値を指定することで解決する


You may pass a default value as the second argument to the input method. This value will be returned if the requested input value is not present on the request:


$name = $request->input('name', 'Sally');

参考URL

Accessing The Request


デフォルトでAppleを選択状態にさせておく

<input type="radio" name="like" id="apple" value='apple' {{ old('like','apple') == 'apple' ? 'checked' : '' }}>

<label for="apple">Apple</label>

old('like','apple') == 'apple'でデフォルトをinput valueと同じ値にしておけばよい


Checkboxの場合

radioボタンの場合、何かしらの値が戻ってきますが(radioの時の例を使うと、AppleかBananaのどちらかがold('like')でとれる。つまり、例外を除いて何かしらのradio項目を選択した状態でsubmitすると仮定する)

Checkboxの場合チェックを入れなかった場合old('要素class名')で取得するとnullが返ってきます。

ですので単純に

<input type="checkbox" name="apple" {{ old('apple') ? 'checked' : '' }}>

でnullでなければ選択状態にする。ことはできるのですが、

問題になってくるのはデフォルトで選択状態にしたい場合です。

デフォルトで選択状態にしたい場合、

このCheckboxが置いてあるFormに遷移してきたときもold('apple')nullだけどcheckedにしたい、でもバリデーションでnullが戻ってきた時はcheckedを外したい

となり、先程のコードではどちらも満たすことができません。

この問題を解決するには$errors->any()の値を見ると解決することができます。

$errors->any()は、バリデーションで引っかかった際にtrueを返します。

ですので、今回の場合、


  • old('apple')がtrue(選択されてた場合はtrue)

  • $errors->any()がfalse(Formに遷移してきた際はfalse状態)

どちらかの条件を満たす場合にchecked状態にすればいいので以下のような判定式にすることで解決します

<input type="checkbox" name="apple" {{ old('apple') || !$errors->any() ? 'checked' : '' }}>