Yii2でチェックボックスがチェックされた場合に入力タグを表示する方法


  1. JavaScriptを使用して表示/非表示を切り替える方法:

    <?= $form->field($model, 'checkbox')->checkbox(['id' => 'my-checkbox']) ?>
    <?= $form->field($model, 'input')->textInput(['id' => 'my-input', 'style' => 'display:none']) ?>
  2. <script>
    document.getElementById('my-checkbox').addEventListener('change', function() {
     var inputTag = document.getElementById('my-input');
     inputTag.style.display = this.checked ? 'block' : 'none';
    });
    </script>
  3. Yii2のAjaxを使用して表示/非表示を切り替える方法:

    • ビューファイルでAjaxリクエストを処理するアクションを定義します。例えば、以下のようなコードを使用できます:

      public function actionToggleInput()
      {
       $model = new MyModel();
       $model->load(Yii::$app->request->post());
       return $this->renderAjax('_input', ['model' => $model]);
      }
    • <?= $form->field($model, 'checkbox')->checkbox(['id' => 'my-checkbox', 'onclick' => '
       $.ajax({
           url: "' . Url::to(['toggle-input']) . '",
           type: "POST",
           data: {checkbox: $(this).prop("checked")},
           success: function(data) {
               $("#my-input-container").html(data);
           }
       });
      ']) ?>
      <div id="my-input-container"></div>
      <?= $form->field($model, 'input')->textInput() ?>

上記の方法は、Yii2フレームワークでチェックボックスがチェックされた場合に入力タグを表示するためのいくつかの一般的な手法です。必要に応じてこれらのコード例をカスタマイズして、プロジェクトの要件に合わせて使用してください。