明細行クリックで画面遷移

!++++

Ver.5　[ 機能を見る ] [ 機能設定を見る ]
Ver.6　[ 機能を見る ] [ 機能設定を見る ]

!----

1. はじめに

Client-side JavaScript を用いて、明細行のクリック操作により画面遷移する方法を紹介しています。

2. サンプル機能の内容と確認ポイント

クリックされた明細行から単票画面へ遷移し、該当行の商品コードで検索された状態で表示する方法を紹介します。

なお、明細行をクリックして別画面を呼び出すには、あらかじめ単票ブロックで「他画面呼出」により画面遷移用のボタンを設定しておく必要があります。

Client-side JavaScript による実装内容は以下のとおりです。
　以下の処理を resizeContents_end 関数内に実装します。

1. 明細行に含まれる不要な遷移ボタンの要素を取得し、display: none を指定して非表示にします。

2. 各明細行に対して forEach ループを使用し、クリックイベントを設定します。

3. クリックイベントハンドラ内で、明細ブロックの「商品コード」値を取得し、単票ブロックの「商品コード」欄に設定します。

4. 単票ブロックに設定された画面遷移ボタンの要素を取得し、.click() を実行して画面遷移を行います。

🔍 確認いただけるポイント

• 明細行をクリックすると、単票画面へ遷移し、該当行の商品コードで検索された状態で表示されます。

3. 画面イメージ

「商品コード」が「ITEM_A」の行をクリックした後の状態を示しています。

「商品コード」が「ITEM_A」で検索された状態の単票画面に遷移した後の表示を示しています。

!++++

使用したコード一覧

!----