LoginSignup
100
99

More than 3 years have passed since last update.

LaravelCollective Formファサード チートシート

Last updated at Posted at 2019-04-12

環境構築

LaravelCollective公式サイト(既に閉鎖)
LaravelCollective公式サイト(リニューアルしたようです。)
LaravelCollective公式GitHub

インストール

$ composer require "laravelcollective/html":"^5.5"

初期設定

laravelのアップデートでなくても動くけど入れるに越したことはない。

config/app.php
'providers' => [
    // ...
    Collective\Html\HtmlServiceProvider::class,
    // ...
  ],
'aliases' => [
    // ...
      'Form' => Collective\Html\FormFacade::class,
      'Html' => Collective\Html\HtmlFacade::class,
    // ...
  ],

仕様メモ

タグの種類とサンプルコードと引数の内容

+aについて

引き数で+aと書かれている場所は配列を渡して属性を追加していく。

['class'=>'クラス名', 'placeholder'=>'プレイスホルダー']
 もしくは
array('style'=>'color:red;',required)

フォームタグ

{{Form::open(['url' => '/', 'files' => true])}}

{{Form::close()}}

第1引数 : 配列 => ルーティング action, ファイルのフォーム使用の可否

CSRFトークン

{{Form::token()}}
  • {{csrf_field()}}がデフォルトが用意されている。お好みで

ラベル

{{Form::label('email', 'E-Mail Address', ['class' => 'awesome red','id' => 'asd'])}}

第1引数 : 関連付けフォームの指定 for
第2引数 : ラベルの文字 value
第3引数 : +a

テキスト

{{Form::text('text', null, ['placeholder' => 'temp'])}}

第1引数 : フォームの名前 name
第2引数 : はじめに入っている値 value
第3引数 : +a

パスワード

{{Form::password('password', ['class' => 'awesome'])}}

第1引数 : フォームの名前 name
第2引数 : +a

チェックボックス

{{Form::checkbox('name', 'value', true, ['class'=>'circle'])}}

第1引数 : フォームの名前 name
第2引数 : 送信される値 value
第3引数 : デフォルトのチェック checked
第4引数 : +a

ラジオボタン

{{Form::radio('name', 'value', true, ['class'=>'circle'])}}

第1引数 : フォームの名前 name
第2引数 : 送信される値 value
第3引数 : デフォルトのチェック checked
第4引数 : +a
* デフォルトのチェックが被っている場合後のラジオボタンが反映される。(読み込み順)

数値

{{Form::number('name', 30, ['class'=>'number'])}}

第1引数 : フォームの名前 name
第2引数 : 送信される値 value
第3引数 : +a

日付

{{Form::date('name', \Carbon\Carbon::now(), ['class'=>'date'])}}

第1引数 : フォームの名前 name
第2引数 : 送信される値 value (\Carbon\Carbon::now()で今日を指定できる)
第3引数 : +a

ファイル

{{Form::file('image', ['class'=>'date'])}}

第1引数 : フォームの名前 name
第2引数 : +a
* フォームタグの'files' => trueが必要である。

ドロップダウンボックス

{{Form::select('size', ['L' => 'Large', 'S' => 'Small'], 'S', ['placeholder' => 'null'])}}

第1引数 : フォームの名前 name
第2引数 : リストの要素 option value
第3引数 : デフォルト値 selected (nullはplaceholderがあればそれ。無ければ配列の始め)
第4引数 : +a

ドロップダウンボックス(範囲指定)

{{Form::selectRange('number', 10, 20, null, ['class' => 'range'])}}

第1引数 : フォームの名前 name
第2引数 : 範囲の指定
第3引数 : 範囲の指定 (数字かアルファベット)
第4引数 : デフォルト値 selected
第5引数 : +a

ドロップダウンボックス(暦月)

{{Form::selectMonth('month', 3, ['class'=>'month'])}}

第1引数 : フォームの名前 name
第2引数 : デフォルト値 (*数字で指定)
第3引数 : +a

ボタン

{{Form::submit('送信', ['class'=>'submit'])}}

第1引数 : ボタンに表示する文字 value
第2引数 : +a

終わりに

{!! XXXX !!}ではエスケープ処理を行われず、{{ XXXX }} の方はエスケープ処理を行う
過去には{!! XXXX !!}の囲み方をする必要があったが、ララベルのアップデートでHTMLタグを読んだときは勝手にエスケープされるようになった。

フォームモデルバインディングとカスタムマクロの動きは確かめていないので、時間があるときに動作の確認が出来次第更新したい。

100
99
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
100
99