LoginSignup
7
6

More than 5 years have passed since last update.

ユーザー選択ダイアログを作成してみる

Last updated at Posted at 2015-04-08

ファイルメーカーの標準コントロールで複数値を選択する方法はチェックボックスしかありません。選択肢が少ない場合はチェックボックスでも問題無いですが、多くの候補から選択する場合や可変で選択肢が増える場合などはレイアウトに困ります。
そこで今回は左右にリストを表示し、左は候補一覧、右に選択された値の一覧を表示するレイアウトを作成してみます。

動作イメージは以下のようになっています。
良くユーザーへの権限付与などの画面で使われているUIです。
複数選択用リストイメージ.png

実装方法は他にもあると思いますので、一つの案だと思って下さい。

用意したテーブル

テーブルは2つです。

顧客テーブル

1つは選択肢一覧用のデータが入ったテーブル。サンプルではダミーの顧客リストにしてみました。
今回は候補値の絞り込みを組み込んだので、その値を入力するためのグローバルフィールドを顧客テーブルに追加しています。

選択値保持用テーブル

2つ目は選択された値を保持するフィールドを持ったテーブルです。このフィールドに選択されたレコードのキー値を保持します。今回はグローバルフィールドにしましたが、通常のフィールドでも大丈夫です。

選択値保持フィールドの初期値

フィールド値が空欄だとリレーションがで値一覧が表示されないので、このフィールドの初期値として 「半角スペース」を設定しています。

リレーション

結構単純なリレーションです。
リレーション

選択された値を表示するためのテーブルオカレンス(以下TO)と候補値を表示するためのTOへのリレーションのみです。

レイアウトの設定

レイアウト上には、「フィルター値入力用の編集ボックス」「候補値一覧用のポータル」「選択された値一覧用のポータル」です。
それぞれのポータルにはボタンを配置して、値の追加と削除をするように設定しています。

サンプルファイルでは、選択値がどのように保存されているか確認するためのテキストフィールドを追加しています。

選択値追加用のボタン設定

ボタンが押された時に、選択値保持用フィールドに改行区切りで値を追加するように設定します。
サンプルの場合以下のように設定しています。
追加用ボタンの設定
List関数を利用してすでに設定されている値に、ボタンが押された行のキー値を追加しています。

選択値消去のボタン設定

ボタンが押された時に、押された行のキー値を選択値保持用フィールドから削除するように設定します。
サンプルの場合、以下のように設定しています。
削除ボタンの設定
Substitute関数を利用して一つ前の改行とキー値を削除しています。

ここまで設定すると、値の追加削除が動作するようになります。

候補一覧のフィルター機能の組み込み

次に候補一覧のフィルター機能の設定をしていきます。

画面更新用スクリプトとトリガーの設定

フィルター値を確定した際に、そのままだとポータル内のリストがフィルターされないので、更新用のスクリプトを用意します。

Filter更新
1 ウインドウ内容の再表示 [キャッシュ結合結果を書き込む]

スクリプトの中身はウィンドウ内容の再表示だけです。

これを編集ボックスのトリガに以下のように設定します。
フィルター用トリガの設定

フィルター値の確定処理用の設定

絞り込み用の値を入力してリターンキーで確定させるための設定をします。
フィルター値の確定処理用の設定

ポータルのフィルター設定

候補値用のポータルに対して、入力された値で一覧を絞り込むための設定をします。
フィルター値が空欄の場合は全てを表示対象として、値が入って居る場合はフィルター値を含むデータを表示対象にします。
ポータルのフィルター設定内容
PatternCount関数を利用してフィルター値が含まれているか判定しています。

以上で設定完了です。

今回のサンプルは以下の場所に置きましたので、詳しくはファイルを参照して下さい。
サンプルファイル

7
6
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
7
6