ドロップダウンリストの絞り込みについて(大項目 ⇒ 小項目)

■実現したいこと

ドロップダウンリスト‗Cat => {パソコン、モニタ、備品}
ドロップダウンリスト‗Detail => {ノート、デスクトップ、21inc、24inc、マウス、キーボード}

などを準備し、ドロップダウンリスト_Catで「パソコン」を選択した場合は「ノート」と「デスクトップ」のみを表示
「モニタ」を選択した場合は、「21inc」「24inc」のみを表示などの制御は可能でしょうか?

ネットなどをしらべたところ、以下のように_Detail_A~C のように、3つのサブリストを事前に準備させ、
_Catで選択したした以外のリストは入力不可(グレーアウト)にする情報はありました。
しかし、大項目 ⇒ 小項目 のように表現したいと考えています。

ドロップダウンリスト‗Cat => {パソコン、モニタ、備品}
ドロップダウンリスト‗Detail_A => {ノート、デスクトップ}
ドロップダウンリスト‗Detail_B => {21inc、24inc}
ドロップダウンリスト‗Detail_C => {マウス、キーボード}

以上、よろしくお願いいたします。

Sophia さん

可能ですが DOM 操作になりますので、HTML, CSS , JavScript の知識が必要でかなり複雑な開発になります。

宣伝になってしまいますが、プラグインにご希望の機能を持つものがありますのでご検討されてはいかがですか?

JOYZO ドロップダウン絞り込みプラグイン

rex0220 項目絞り込みプラグイン

TiS ルックアップ/階層区分対応ドロップダウン変換プラグイン

rex0220さん

 

 

ぱっと簡単に言葉で表現できるものも、プログラムに落とし込むとなると複雑になること承知いたしました。

本件、ご回答ありがとうございました。