jQuery

Javascript,jQuery

【jQuery】連動プルダウン用プラグイン『jquery.tgHierSelect』をより簡単に設置できるようバージョンアップ

2017/12/15

以前作成した「jquery.tgHierSelect」ですが、連動させるプルダウンの数が増えた場合や、同じページに2個以上の連動プルダウンがある場合にかなり手を入れないと使えない状態だったので、それらを解決しつつ、オプションの記述もシンプルになるようバージョンアップしました。

jQueryで連動プルダウン jquery.tgHierSelectV2

イメージ

jQuery.tgHierSelectVer.2

デモ

今回は5段階、3段階の2種類のプルダウンを1ページ内で連動させています。

HTMLに記載するオプションの記述方法

例の上が5段階連動用、下が3段階用となります。

・group / 連動させるプルダウンのグループ名(例:group1)
・maxLevel / 最大レベル(例:5)
・defaultSelect / デフォルトのオプションとするテキスト(例:▼選択)
を指定して下さい。
全て必須です。

プルダウンの親子関係設定方法

デモ(2)のLv1と2を抜粋して説明します。

子プルダウンのclass名に、親のValue値を "p親value" として親子関係を関連付けします。

ダウンロード

こちらからどうぞ。(SourceTreeでの公開は停止しました)

今考えると、以前のものは使えるレベルではなかった気がしますね(苦笑)

-Javascript,jQuery
-, , , , , , , , ,