!++++
Ver.5 [ 機能を見る ] [ 機能設定を見る ]
Ver.6 [ 機能を見る ] [ 機能設定を見る ]
!----
1. はじめに
本サンプルでは、スマートデバイス機能を利用して QR コードのスキャン結果を単票ブロックに表示するとともに、その履歴を明細ブロックへ順次追加して表示する処理 を紹介します。
なお、追加された値は DB には保存されず、現在表示中の画面の中だけで保持される一時的な表示データ となります。
画面を閉じると保持内容は破棄されます。
2. 利用条件
この機能を利用するには、スマートデバイスオプションの有償ライセンスが必要です。
3. サンプル機能の内容と確認ポイント
本サンプルでは、QR コードのスキャン実行から単票・明細への表示までの一連の処理フローを確認できます。
主な設定および動作のポイントは以下のとおりです。
-
事前準備（採番設定）
明細ブロックに行を追加するための一意キーとして、採番 「SCREEN_SAMPLE_0702_ID」 を作成します。
-
スキャン後の画面更新／非同期通信に関わる設定
「機能設定画面 ＞ 非同期通信」において、
QR コードスキャン完了後に Client-side JavaScript から 自動クリックされるボタン を設定します。
当該ボタンでは 「DB 検索前 JavaScript」 を使用し、TALON.setSearchedDisplayList()により、スキャン結果を単票ブロック および 明細ブロック へ反映します。
なお、「DB 検索前 JavaScript」でTALON.setSearchedDisplayList() を実装した場合、SELECT 式は実行されません。
そのため、各ブロックは 画面項目定義としての役割のみを持ち、表示データは「DB 検索前 JavaScript」側で生成されます。
- 単票ブロック：最新のスキャン結果を表示
- 明細ブロック：スキャン結果を行として順次追加表示（画面表示中のみ保持）
-
Client-side JavaScriptの設定
機能設定画面の Client-side JavaScript にて、以下の項目を設定します。
- createScanButton()：setScanButton()にてバーコードスキャン用の項目を設定し、「スキャン」ボタンを画面に表示させます。
- afterDetection()：スキャン後に非同期通信ボタンを自動開始するよう実装します。
🔍 確認いただけるポイント
- 指定項目にスキャンボタンが表示され、タップ時にカメラが起動すること
下記のQRコード（バーコード）が正常に読み取られること
スキャン完了後、自動的に非同期通信処理が実行されること
単票ブロックに直近のスキャン結果が表示され、明細ブロックに履歴として行が順次追加されること
4. 画面イメージ
以下は、画面の初期表示状態から、スマートフォンのカメラを使用したバーコードスキャン後までの画面例です。
|
【初期画面】 |
【スキャン後の画面】 |
使用したコード一覧