bladeでのformタグについてまとめる。

#例えばこんな記述を理解したい。

.php

<input id="zipCode" type="text" name="zipCode" class="@error('zipCode') is-invalid @enderror" placeholder="※ハイフンなし" value="{{ old('zipCode') }}"  autocomplete="zipCode" autofocus>

#formタグの属性

##id属性

.php

id="zipCode"

HTML的な属性。
後出てくるが、inputタグが、打ち込んだ内容を保持する時に、どのフォームかの識別をする時に指定する。

@errors('zipCode')
エラーがあるかどうかの判断も、idの値で行っている。
ここを、@errors('pref')などとした場合は、id=prefタグに対するエラーが表示される。

.php

value="{{ old('zipCode') }}"

##name属性

.php

name="zipCode"

$request->zipCode=入力した内容

PHP的な属性。
Requestファサードに格納される時の連想配列のキー名。

##type属性

hidden
画面上は表示されない隠しデータを指定する
text
一行テキストボックスを作成する（初期値）
search
検索テキストの入力欄を作成するHTML5から追加
tel
電話番号の入力欄を作成するHTML5から追加
url
URLの入力欄を作成するHTML5から追加
email
メールアドレスの入力欄を作成するHTML5から追加
password
パスワード入力欄を作成する
datetime
UTC（協定世界時）による日時の入力欄を作成するHTML5から追加
date
日付の入力欄を作成するHTML5から追加
month
月の入力欄を作成するHTML5から追加
week
週の入力欄を作成するHTML5から追加
time
時間の入力欄を作成するHTML5から追加
datetime-local
UTC（協定世界時）によらないローカル日時の入力欄を作成するHTML5から追加
number
数値の入力欄を作成するHTML5から追加
range
レンジの入力欄を作成するHTML5から追加
color
色の入力欄を作成するHTML5から追加
checkbox
チェックボックスを作成する
radio
ラジオボタンを作成する
file
サーバーへファイルを送信する
submit
送信ボタンを作成する
image
画像ボタンを作成する
reset
リセットボタンを作成する
button
汎用ボタンを作成する

##autocomplete属性

.php

autocomplete="zipCode"

zip過去に入力した内容が入力候補として表示されるようになる。

#autofocus属性

.php

autofocus

値を持たない属性。
画面が表示した時に、どのフォームに打ち込むように選択されている状態のタグに書き込む。

##value属性

.php

value="{{ old('zipCode') }}"

リダイレクトバックしたときなどに、一画面前に入力した内容がフォームに残っているようにするもの。
他にも初期値などを設定できる。
この時は、idを指定することで、値を保持できる。

例えば！
以下のように記述すれば、同ページ内のid='prefecture'のinputタグのさっき打った値がでてくる。

.html

<input ~~ value="{{ old('prefecture') }}">

##placeholder属性

.php

placeholder="※ハイフンなし"

valueではないが、空のときに、薄い灰色の時で文字を置く。