スライドショースライドショー

【CakePHP入門】checkboxの使い方を理解しよう!

こんにちは!フリーエンジニアのヤマシタです。

CakePHPでフォームを作成するにはFormHelperを使用します。

なかでもよく使用する機能の1つとしてチェックボックスがあります。

チェックボックスとはユーザーが単一の項目や複数の項目を選択、解除するときによく使用されます。

この記事では、

・checkboxメソッドとは?
・checkboxメソッドの基本的な使い方

という基本的な内容から、

・inputメソッドでチェックボックスを作成する方法
・チェックボックスのhiddenフィールドを無効にする方法

などのチェックボックスの応用的な処理についても解説します。

ここではcheckboxメソッドを使用して、チェックボックスを作成する方法について詳しく解説していきます!

使用環境: cakephp-3-4-7

checkboxとは

checkboxメソッドとは、チェックボックスを作成するときに使用するFormHelperのメソッドの1つです。

チェックボックスは、フォームから1つまたは複数の項目をまとめて選択するときに使用します。

checkboxメソッドは、以下のように記述します。

checkbox(String $フィールド名, array $オプション)

第一引数にはフィールド名を指定し、第二引数はchackboxをコントロールするための共通オプションを指定します。

CakePHPでフォームを作成するFormHelperの基本的な使い方については、以下の記事で詳しく解説しています。

checkboxの使い方

ここでは実際にcheckboxメソッドの使い方を見ていきましょう。

以下にcheckboxメソッドを使用して、簡単なチェックボックスを作成する方法を記述します。

SampleController.php

<?php

namespace App\Controller;

use App\Controller\AppController;

class SampleController extends AppController
{

  public function index() {

  }
}
?>

index.ctp

<?php

    //フォームの作成
    echo $this->Form->create();

    //チェックボックスの作成
    echo $this->Form->label('checkbox1', 'チェック');
    echo $this->Form->checkbox('checbox1');

    //フォームの終了
    echo $this->Form->end();

?>

実行結果

image1

labelメソッドを使用する場合は、関連付けるcheckboxと同じ名称を第一引数のフィールド名に指定します。

inputを使用する方法

チェックボックスはcheckboxのほかに、inputメソッドを使用しても同様に作成できます。

以下にinputメソッドを使用して、簡単なチェックボックスを作成する方法を記述します。

    //フォームの作成
    echo $this->Form->create();

    //チェックボックスの作成
    echo $this->Form->input( 'checkbox1', array(
      'type' => 'checkbox',
      'label' => 'チェック1',
    ));
    echo $this->Form->input( 'checkbox2', array(
      'type' => 'checkbox',
      'label' => 'チェック2',
    ));
    echo $this->Form->input( 'checkbox3', array(
      'type' => 'checkbox',
      'label' => 'チェック3',
    ));

    //フォームの終了
    echo $this->Form->end();

実行結果
image2

hiddenフィールドの解除

HTMLではhiddenを指定した場合は、ブラウザ上では表示されないデータを送信することができます。

そのため隠し要素とも呼ばれますが、CakePHPの場合デフォルトではこのhiddenフィールドが有効となっています。

以下はcheckboxメソッドを使用したときに生成されるhtmlです。

<input type="hidden" name="checkbox" value="0"/>
<input type="checkbox" name="checkbox" value="1">

余分なhiddenフィールドを無効にしたい場合はcheckboxの第二引数引数のオプションで、「'hiddenField' => true」を指定します。

echo $this->Form->checkbox('checkbox', array('hiddenField' => false));

hiddenFieldをfalseに指定することで、余分なhiddenフィールドを削除することができました。

<input type="checkbox" name="checkbox" value="1">

まとめ

ここでは、チェックボックスの基本的な作成方法やinputメソッドを使用したチェックボックスの作成方法、余分なhiddenフィールドを無効にする方法などについて解説しました。

チェックボックスはフォームを作成する上で、よく使用する部品ですので作成方法については理解しておきましょう。

もし、チェックボックスの作成方法を忘れてしまったら、この記事を思い出してくださいね。

LINEで送る
Pocket

無料でSEからWebエンジニアへ転職しませんか?



侍エンジニア塾では、完全未経験の方から現在SEだけどプログラミングはやっていないという経験者まで、幅広い方々の人生を好転させるプログラミング指導を行ってきました。SEの方とお話していくなかで、

  • システムエンジニアという職業だけどコードが書けない
  • 事務作業が多くスキルがないため将来が不安
  • スクールに通うと完全未経験者と同じスタートになるからレベルが合わない
という、すでに知識があるSEならではのお悩みがあることに気づきました。そんな方におすすめなのが、弊社の「転職コース 」です。

弊社では、マンツーマンでレッスンを行いますので、現在お持ちの知識レベルからカリキュラムを作成いたします。さらにこちらの転職コースは無料で受講を始められて転職成功でそのまま卒業できるというとてもお得なコースとなっています。

既に知識のあるSEといっても転職は年齢が若いほど受かりやすいため、まずは無料体験レッスンで今の現状や理想の働き方について一緒に考えていきましょう。

まずは無料体験レッスンを予約する

書いた人

ヤマシタ

エンジニア歴10年のフリーランスエンジニア。ITに関わるさまざまなコンテンツの企画・制作も行っています。
ITに関してはノウハウ系、ライフハック系、トレンド系など、200本以上の執筆経験があります。

おすすめコンテンツ

あなたにぴったりなプログラミング学習プランを無料で診断!

プログラミング学習の効率を劇的に上げる学習メソッドを解説