表題の通り、Laravelでセレクトボックスの値からプルダウンを表示・非表示にしたいです。
jsのフレームワークはjQueryを使っています。
ユーザー1を選択した時
プルダウン②を表示させて、プルダウン③は非表示
プルダウンは動的に変更させたいです。
通常なら、
$hoges = Hoge::get(); balde側 <select id="hoge"> @foreach ($hoges as $hoge) <option value="{{ $hoge->id }}" id="hogeId">{{ $hoge->name }}</option> @endforeach </select> js側 $('#hoge').change(function () { let id = $('#hogeId').val(); if (id === 1) { // プルダウン②と③非表示 } elseif (id === 2) { // プルダウン②表示、③非表示 } })
みたいに書けばいいと思いますが、今回やりたいことは、
①セレクトボックスを選択した時に、そのvalue値をまず取得する
②取得した値をもとにそのテーブルのカラムの値を取得する
③②で取得した値をもとにプルダウンを表示・非表示にする
という形式でコードを書いていきたいのですがどう実装すればいいのか、わからずに悩んでいます。
具体例で書くと、
<option value="{{ $hoge->id }}"> ※ここでは1とします。 $hoge->id (1の値)をもとに$hogesテーブルのレコードを取得hogesテーブルの構造
hoge_id hoge_name role_id
今回は値がhoge_idが1なので、
hoge_id 1
hoge_name hoge
role_id 3
のレコードを取得する。
role_id3を取得
role_idをもとにjsで条件分岐させてプルダウンを表示・非表示にさせる。
上記のような処理の場合、
js側
$('#hoge').change(function () { let id = $('#hogeId').val(); // hogeIdをもとにhogesテーブルのレコードを一意に絞り込む // そこからrole_idの値を取得 // role_id === 1の時にプルダウン表示・非表示 if (id === 1) { // プルダウン②と③非表示 } elseif (id === 2) { // プルダウン②表示、③非表示 } })
みたいな感じになって、jsでデータベース操作するの?みたいになっててわからないです。
どのようにすれば目的の動作が得られますか?
あなたの回答
tips
プレビュー