質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

ただいまの
回答率

90.99%

  • jQuery

    5833questions

    jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

  • CakePHP

    2128questions

    CakePHPは、PHPで書かれたWebアプリケーション開発用のフレームワークです。 Ruby on Railsの考え方を多く取り入れており、Railsの高速性とPHPの機動性を兼ね備えています。 MVCやORMなどを「規約優先の考え方」で利用するため、コードを書く手間を省くことができます。 外部のライブラリに依存しないので、単体での利用が可能です。

cakephp3 動的セレクトボックスが正しく表示されません。

解決済

回答 1

投稿 編集

  • 評価
  • クリップ 1
  • VIEW 376

lovelydai

score 20

こんにちは、時間割システムを作っている初心者です。

やりたいのは、学部セレクトボックスを選択するとその学部に属している学科をDBから読み取り、セレクトボックスに表示したいです。

以下のページを参照して試してみました。
https://qiita.com/katsuakikon/items/7a8fcaf85b342cb61bcc

ソースコードは以下のようです。

//ParticipantController.phpの中に次のようなFunctionを定義しました。

    public function getOptions($id = null)
    {
      $this->autoRender = false;
      $this->viewBuilder()->setLayout(false);

      $courses = $this->Participant->Course->getOptions($id); // アソシエーションされてます。
      $this->set('courses',$courses);
    }
    public function getOptions($id = null)
    {
        // デフォルト値
        $result = ["" => "選択してください"];

        if(!empty($id))
        {
          $result = $this->find('list', ['keyField' => 'course_idx', 'valueField' => 'course_name'])
                          ->where(['section_idx' => $id])
                          ->andWhere(['is_used' => 1])
                          //->toArray();
        }
        return $result;
    }
  <div class="form-group">
      <div class="col-lg-12">
           <?= $this->Form->label('学部'); ?>
               <?php
                   echo $this->Form->select('section_idx',
                   ['options' => $sections],
                   ['empty' => '(学部を選択してください。)','class'=>'form-group','id' => "section_idx"]);
                ?>
         </div>
   </div>

 <div class="form-group">
     <div class="col-lg-12">
         <?= $this->Form->label('学科'); ?>
               <?php
                    if(isset($courses))
                    {
                      echo $this->Form->select('course_idx',
                        ['options' => $courses],
                        ['empty' => '(学科を選択してください。)','class'=>'form-group','id' => "course_idx"]
                      );
                    }
                    else
                    {
                     echo $this->Form->select('course_idx',
                      ['options' => ''],
                      ['empty' => '(学科を選択してください。)','class'=>'form-group','id' => "course_idx"]
                   );
               }
           ?>
       </div>
   </div>

<script>
$("#section_idx").bind("change keyup", function() {
    var id = $("#section_idx").val();
    $("#course_idx").load( "./getOptions/"+id);
});
</script>

すると、学部セレクトボックスが変わると学科セレクトボックスには動きはありますが、データが何も表示されません。セレクトボックスを押してみるとスクリーンショットのように開かれます。(下に何かありそうですが下が切れてしまいます。)
イメージ説明
DebugToolBarのHistory(XHRのGet)で確認すると、成功的にSQLも実行され、$coursesの値も問題なく入っていますが、実行後のページには$coursesもなく、何も表示されません。
何が問題なのかぜんぜん気が付かないし、データは問題なく値に入ったので表示させたいのですが上手くできませんでした。
何かアドバイスいただければと思います。
よろしくお願いいたします。

「追加」Logに残っているWarningメッセージがありました。以下のようです。
2017-11-01 11:47:21 Notice: Notice (8): Object of class Cake\ORM\Query could not be converted to int in [D:\Bitnami\wampstack-7.1.7-0\apache2\htdocs\djks\trunk\src\Model\Table\CourseTable.php, line 166]
Request URL: /participant/getOptions/4
Referer URL: http://localhost:8765/participant/add

017-11-01 11:47:21 Error: [Error] Unsupported operand types in D:\Bitnami\wampstack-7.1.7-0\apache2\htdocs\djks\trunk\src\Model\Table\CourseTable.php on line 166
Request URL: /participant/getOptions/4
Referer URL: http://localhost:8765/participant/add

「追加」上の2つのエラーを解決しましたが、まだ表示されません。

  • 気になる質問をクリップする

    クリップした質問は、後からいつでもマイページで確認できます。

    またクリップした質問に回答があった際、通知やメールを受け取ることができます。

    クリップを取り消します

  • 良い質問の評価を上げる

    以下のような質問は評価を上げましょう

    • 質問内容が明確
    • 自分も答えを知りたい
    • 質問者以外のユーザにも役立つ

    評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

    質問の評価を上げたことを取り消します

  • 評価を下げられる数の上限に達しました

    評価を下げることができません

    • 1日5回まで評価を下げられます
    • 1日に1ユーザに対して2回まで評価を下げられます

    質問の評価を下げる

    teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。

    • プログラミングに関係のない質問
    • やってほしいことだけを記載した丸投げの質問
    • 問題・課題が含まれていない質問
    • 意図的に内容が抹消された質問
    • 広告と受け取られるような投稿

    評価が下がると、TOPページの「アクティブ」「注目」タブのフィードに表示されにくくなります。

    質問の評価を下げたことを取り消します

    この機能は開放されていません

    評価を下げる条件を満たしてません

    評価を下げる理由を選択してください

    詳細な説明はこちら

    上記に当てはまらず、質問内容が明確になっていない質問には「情報の追加・修正依頼」機能からコメントをしてください。

    質問の評価を下げる機能の利用条件

    この機能を利用するためには、以下の事項を行う必要があります。

回答 1

check解決した方法

0

また自己解決しました。

Controller側で<option>~</option>タグの形でそのまま($this->set()無しで)ビューに投げてビューではJQueryのLoadで表示するという形で何とかなりました。

// ParticipantController.phpの中
public function getOptions($id = null)
    {
      $this->autoRender = false;
      $this->viewBuilder()->setLayout(false);


      $courses = $this->Participant->Course->getOptions($id);

      if($courses)
      {
        echo "<option>(学科を選択してください。)</option>";
        foreach($courses as $key => $value)
        {
          $key = '"'. $key .'"';
          echo "<option value=$key>$value</option>";
        }
      }
      else {
        echo "<option>(学科を選択してください。)</option>";
      }

    }
// add.ctpやedit.ctpの中、結局に空っぽのチェックボックスを作るだけになる。
<?php
    if(isset($courses))
    {
      echo $this->Form->input('course_idx',
        ['empty' => '(学科を選択してください。)','class'=>'form-group','id' => 'course_idx', 'label' => false]
      );
    }
    else
    {
      echo $this->Form->select('course_idx',
        ['options' => ''],
        ['empty' => '(学科を選択してください。)','class'=>'form-group','id' => 'course_idx', 'label' => false]
      );
    }
?>
// add.ctpやedit.ctpの中
<script>
// 修正の時にページがローディングされたら、学科セレクトボックスをDBの値で初期化しチェック状態にする。
$(function(){
  $('#section_idx').ready(function() {
      var id = $('#section_idx').val();
      $('#course_idx').load('../getOptions/'+id,(function(){
          var idx = <?php echo json_encode(h($participant->course_idx), JSON_HEX_TAG | JSON_HEX_AMP | JSON_HEX_APOS | JSON_HEX_QUOT); ?>;
          $('#course_idx').val(idx);
        }));
  });
});
// 学部セレクトボックスを変更すると学科セレクトボックスを更新する。
$(function(){
  $('#section_idx').bind('change keyup', function() {
      var id = $('#section_idx').val();
      $('#course_idx').load('../getOptions/'+id);
  });
});
</script>

投稿

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

15分調べてもわからないことは、teratailで質問しよう!

  • ただいまの回答率 90.99%
  • 質問をまとめることで、思考を整理して素早く解決
  • テンプレート機能で、簡単に質問をまとめられる

関連した質問

同じタグがついた質問を見る

  • jQuery

    5833questions

    jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

  • CakePHP

    2128questions

    CakePHPは、PHPで書かれたWebアプリケーション開発用のフレームワークです。 Ruby on Railsの考え方を多く取り入れており、Railsの高速性とPHPの機動性を兼ね備えています。 MVCやORMなどを「規約優先の考え方」で利用するため、コードを書く手間を省くことができます。 外部のライブラリに依存しないので、単体での利用が可能です。