imuiMultiDragbox
コンポーネント情報 | |
---|---|
モジュール | im_ui |
導入されたバージョン | 8.0.5 |
バージョン | 8.0.12 |
機能説明
- ドラッグボックスが二つ、移動ボタン、ソートボタンを組み合わせたコンポーネントです。
- ドラッグボックス間で、データの移動が行えます。すべての項目の移動と選択状態の項目の移動が行えます。
- 移動方法は以下の三つがあります。
- 移動ボタンを押下
- ドラッグアンドドロップ
- 項目のダブルクリック
- 選択済み(右側)のボックスではデータのソートが行えます。上下に一つ移動と先頭または最後の項目に移動が可能です。
- selectedName, deselectedName属性を指定することで、ボックス内のデータのvalue値をサブミットできます。
- シフトキーで範囲選択、コントロールまたはコマンドキーでデータの複数選択ができます。
属性一覧
注釈 | 属性名 | 型 | 説明 | 省略時の動作 |
---|---|---|---|---|
deselectedName |
string | 選択されていない側(左側)のボックスのname属性として出力されます deselectedName属性に指定した値でvalue値をサブミットします |
- | |
国際化 無害化 | deselectedTitle |
string | 選択されていない側(左側)のボックスのタイトルです | - |
height |
string | 各ボックスの縦幅を指定します 数値のみからなる文字列、または単位をpxで指定してください |
240px | |
HTML5
Boolean属性
|
hidden |
boolean | マルチドラッグボックスを非表示にします | false |
id |
string | マルチドラッグボックスのidです | 代替idを付与 | |
name |
string | マルチドラッグボックスのnameです | 代替nameを付与 | |
selectedName |
string | 選択されている側(右側)のボックスのname属性として出力されます selectedName属性に指定した値でvalue値をサブミットします |
- | |
国際化 無害化 | selectedTitle |
string | 選択されている側(右側)のボックスの説明です | - |
Boolean属性 | sortable |
boolean | ソートボタンを表示するかどうかを指定します true の場合はソートボタンを表示します |
true |
validateDeselectedName |
string | 選択されていない側(左側)のボックスのバリデーション対象のname属性として出力されます | - | |
validateSelectedName |
string | 選択されている側(右側)のボックスのバリデーション対象のname属性として出力されます | - | |
values |
Array | 表示するデータを配列で指定します values属性の詳細は下記の values を参照してください |
- | |
width |
string | マルチドラッグボックスの横幅を指定します 数値のみからなる文字列、または単位をpxで指定してください width 属性に指定した値がそれぞれにボックスに適用されます 実際にコンポーネントが持つ横幅はwidth属性に指定した値のボックスが二つ分とボタンの横幅の領域になります |
200px | |
無害化 | その他 |
string | ユーザ定義属性です | - |