ゆーものメモ帳

この文書は読取専用です。文書のソースを閲覧することは可能ですが、変更はできません。もし変更したい場合は管理者に連絡してください。
====== 【Laravel】Form ファサードを使った書き方 ======
blade テンプレートでの Form ファサードを使った書き方。
  * [[https://laravelcollective.com/docs/6.x/html|ドキュメント]]
==== フォームタグ ====
<code:php>
# 基本の書き方
{{ Form::open() }}
{{ Form::close() }}

# URL 指定
{{ Form::open(['url' => 'http://example.com']) }}

# ルーティング指定
{{ Form::open(['route' => 'home.index']) }}
{{ Form::open(['route' => ['home.index', $user]]) }}

# コントローラ指定
{{ Form::open(['action' => 'Controller@method']) }}

# GET 送信
{{ Form::open(['method' => 'get']) }}

# ファイルアップロード
{{ Form::open(['files' => true]) }}
</code>

==== テキスト、テキストエリア ====
  * 第１引数：名前
  * 第２引数：値
  * 第３引数：属性を配列形式で指定（key が属性、value が属性値）
<code:php>
# テキスト
{{ Form::text('name') }}
{{ Form::text('title', null, ['class' => 'cssクラス名']) }}

# テキストエリア
{{ Form::textarea('explain') }}
{{ Form::textarea('note', null, ['class' => 'cssクラス名', 'rows' => '5']) }}
</code>
==== セレクトボックス ====
  * 第１引数：名前
  * 第２引数：プルダウンの内容を配列形式で指定（key が option の value、value が表示タイトル）
  * 第３引数：selected にする値
  * 第４引数：select タグの属性を配列形式で指定（key が属性、value が属性値）
  * 第５引数：option タグの属性を配列形式で指定
<code:php>
{{ Form::select('pref', $pref_list) }}
{{ Form::select('area', [1 => '東日本', 2 => '西日本'], 1, ['class' => 'cssクラス名']) }}
</code>
option タグに属性を指定したい場合の方法が公式ドキュメントに見つからず苦労しました。\\
ドキュメントには見当たりませんでしたが、以下のように第５引数を指定することで、option タグに各種属性を持たせることができます。
<code:php>
$types = [
    1 => 'TYPE A',
    2 => 'TYPE B',
    3 => 'TYPE C',
];

$options = [
    1 => ['disabled' => true],
    3 => ['style' => 'color:#f00'],
];

{{ Form::select('type', $types, $type ?? null, ['placeholder' => '-'], $options) }}
</code>

==== チェックボックス、ラジオボタン ====
  * 第１引数：名前
  * 第２引数：値
  * 第３引数：true（checked）、もしくは false / null
  * 第４引数：属性を配列形式で指定（key が属性、value が属性値）
<code:html>
# チェックボックス
<label>{{ Form::checkbox('hobby[]', 'movie') }}映画</label>
<label>{{ Form::checkbox('hobby[]', 'sport', true, ['class' => 'cssクラス名']) }}スポーツ</label>

# ラジオボタン
<label>{{ Form::radio('gender', 1, true) }}男性</label>
<label>{{ Form::radio('gender', 2, null, ['class' => 'cssクラス名']) }}女性</label>
</code>
ゆーものメモ帳

ユーザ用ツール

サイト用ツール

ページ用ツール
