【SaaSForce】画面項目の表示切替
- 2025年01月27日
本記事では、画面項目の表示を関数を用いて切り替える方法についての説明を行います。
以下は、操作方法になります。
初期画面の表示切替:
開発画面メニューから「画面項目定義」>〔概要定義〕>「画面コントロール」>〔動作処理〕>〔新しい関数の追加〕
項目選択に応じた表示切替:
開発画面メニューから「画面レイアウト」>〔編集〕>選択させる項目を右クリック>「コードを表示」>〔新しい関数の追加〕
1.関数名称を設定、実行場所の選択
実行場所は、DB処理がある場合は、サーバー処理、項目の表示や入力の制御のみの場合は、クライアント処理です。
2.メニューから「関数編集」を選択
3.表示の切り替えを行う関数を作成
基本的には、Javascriptで書いていきます。
①選択項目の値取得と新規画面・編集画面のモードの選択を行う
選択項目の値取得:
選択項目の値取得には実行場所がクライアントの場合「`getObj(‘項目ID’).value;`」、サーバーの場合「`getObj(‘項目ID’);`」もしくは「`getParam.(‘項目ID’);`」で取得することができます。
基本的に選択された項目の名前ではなく、IDが取得されます。
新規画面・編集画面のモードの選択:
新規画面・編集画面のモードは`mode`オブジェクトによって保存されているため、実行場所がクライアントの場合「`getObj(“mode”).value;`」、サーバーの場合「`getObj(“mode”);`」もしくは「`getParam.(“mode”);`」で取得することができます。
`mode`が`2`の場合は新規画面であり、`1`の場合は編集画面となります。
②表示の切り替えを行う
選択項目に応じた条件分岐を`if`文で記述し、表示の切り替えを行います。
表示の切り替えには、`show`メソッド(項目の表示)と`hide`メソッド(項目の非表示)を使用します。
表示する場合:
- クライアントの場合:「`$(‘#項目のdivID’).show();`」
- サーバーの場合:「`ActStr += “$(‘#項目のdivID’).show();”;`」
非表示の場合:
- クライアントの場合:「`$(‘#項目のdivID’).hide();`」
- サーバーの場合:「`ActStr += “$(‘#項目のdivID’).hide();”;`」
※クライアントの場合:「`SF.setServerExecute(true);`」
サーバーの場合:「`ActStr += “SF.setServerExecute(true);”;`」
これらはその後のサーバー処理が実行可能という意味で、そのまま記述してください。
4.関数を実装
関数編集画面の〔保存〕で関数を保存することができます。
初期画面:開発画面メニューから「画面項目定義」>〔概要定義〕>「画面コントロール」>〔動作処理〕
項目選択:開発画面メニューから「画面レイアウト」>〔編集〕>選択させる項目を右クリック>「コードを表示」
のどちらか該当する方の画面を選択してください。
下記の手順で関数を実装することができます。
初期画面の表示切替:
- 「イベント」を「PageAfterLoad」に設定
- イベント内実行順番を`1`に設定
- 作成した関数名を検索して設定
- 〔保存〕>画面定義の〔保存〕
項目選択に応じた表示切替:
- 実行順番を`1`に設定
- 関数タイプを「詳細画面利用関数」に設定
- 作成した関数名を検索して設定
- 〔保存〕>画面レイアウトを保存