10. 作成するPlug-inの概要
2018/5/19
All contents copyright Six Square Japan Co., Ltd. All Rights Reserved.
10
select PRODUCT -– 商品名
, P_VALUE -- 価格
, HIGHLIGHT -- ハイライト(0|1)
from T_PRODUCTS
ページにHTMLの表を作成し、
High Light が”1”の行について、強調表示する。
T_PRODUCTS
11. 作成するPlug-inで説明するポイント
2018/5/19
All contents copyright Six Square Japan Co., Ltd. All Rights Reserved.
11
select PRODUCT -– 商品名
, P_VALUE -- 価格
, HIGHLIGHT -- ハイライト(0|1)
from T_PRODUCTS
ページにHTMLの表を作成し、
High Light が”1”の行について、強調表示する。
T_PRODUCTS
? アプリケーション?ビ
ルダーから入力した
SQLの操作方法
? PL/SQLのHTMLレン
ダリング方法
? CSSの読み込み
13. Plug-in01-02. テーブルを作る
2018/5/19
All contents copyright Six Square Japan Co., Ltd. All Rights Reserved.
13
テーブルを作ります。(続き)
T_PRODUCTS
ID NUMBER
PRODUCT VARCHAR2(255)
P_VALUE NUMBER
HIGHLIGHT NUMBER
14. Plug-in01-03. テーブルを作る
2018/5/19
All contents copyright Six Square Japan Co., Ltd. All Rights Reserved.
14
テーブルを作ります。(続き)
新規順序から移入
主キーにIDを指定、他はデフォルト
他は画面飛ばします。以下出来たSQLです。
CREATE table "T_PRODUCTS" (
"ID" NUMBER,
"PRODUCT" VARCHAR2(255),
"P_VALUE" NUMBER,
"HIGHLIGHT" NUMBER,
constraint "T_PRODUCTS_PK" primary key ("ID")
)
/
CREATE sequence "T_PRODUCTS_SEQ"
/
CREATE trigger "BI_T_PRODUCTS"
before insert on "T_PRODUCTS"
for each row
begin
if :NEW."ID" is null then
select "T_PRODUCTS_SEQ".nextval into :NEW."ID" from sys.dual;
end if;
end;
/
26. Plug-in03-04. Plug-inを作る
2018/5/19
All contents copyright Six Square Japan Co., Ltd. All Rights Reserved.
26
プラグインを作ります。(ソース画面詳細です。3/5)
--
sys.htp.p('<table>');
-- 表のヘッダ
sys.htp.p('<thead>');
sys.htp.p(' <tr>');
sys.htp.p(' <th>商品名</th>');
sys.htp.p(' <th>価格</th>');
sys.htp.p(' <th>ハイライト</th>');
sys.htp.p(' </tr>');
sys.htp.p('</thead>');
sys.htp.p('<tbody>');
-- 取得したデータの1列目の値配列に対してcount。行の数だけループする。
for i in 1 .. l_column_value_list(1).value_list.count
loop
-- ハイライト対象のチェック
if (l_column_value_list(3).value_list(i).number_value = 1) then
-- 取得したデータの3列目のi行目の値が1の場合はハイライトのクラスを指定する。
sys.htp.p(' <tr class="highlight">');
else
sys.htp.p(' <tr>');
end if;
sys.htp.pファンクションにて、HTMLをレンダリングします。
ハイライトさせる部分を分岐させます。ハイラ
イト対象はclassを指定します。
取得したデータをもとにループします。
(マニュアルの構文の例は間違っているため、
注意してください)
27. Plug-in03-04. Plug-inを作る
2018/5/19
All contents copyright Six Square Japan Co., Ltd. All Rights Reserved.
27
プラグインを作ります。(ソース画面詳細です。4/5)
end if;
-- 値のレンダリング時はescape_scにてエスケープする。(特殊文字対策)
-- 商品名
sys.htp.p(
' <td>'
|| sys.htf.escape_sc(l_column_value_list(1).value_list(i).varchar2_value)
|| ' </td>');
-- 価格
sys.htp.p(
' <td>'
|| sys.htf.escape_sc(to_char(l_column_value_list(2).value_list(i).number_value,'FM999,999,999,990'))
|| ' </td>');
-- ハイライト
sys.htp.p(
' <td>'
|| sys.htf.escape_sc(l_column_value_list(3).value_list(i).number_value)
|| ' </td>');
sys.htp.p(' </tr>');
end loop;
SQLにて取得した各値を出力します。
28. Plug-in03-04. Plug-inを作る
2018/5/19
All contents copyright Six Square Japan Co., Ltd. All Rights Reserved.
28
プラグインを作ります。(ソース画面詳細です。5/5)
end loop;
sys.htp.p('</tbody>');
sys.htp.p('</table>');
return null;
exception
when OTHERS then
raise;
end highlight_report_render;
テーブルタグを閉じてreturn NULLをしています。
プラグインでエラーとなった場合に、エラーが直接通知されます。
この場合、画面自体が出力できなくなるため、内容に応じてエラー
を画面に出力して、raiseしないというのも出来ます。
その場合、raiseの代わりにsys.htp.pなどでエラー内容をユーザ側
に表示します。
29. Plug-in03-05. Plug-inを作る
2018/5/19
All contents copyright Six Square Japan Co., Ltd. All Rights Reserved.
29
プラグインを作ります。(続き)
ソースに記述したファンクション名を入力します。
Ajaxについては、別ファンクションをソース内に記載し、
apex.server.pluginを利用して、Ajaxのリクエストを投げるような処理を追
加する場合に利用します。(jQuery.ajaxのラッパーです)
https://docs.oracle.com/cd/E57425_01/121/AEAPI/javascript_api.htm#BGBDIHHD
レンダリング?プロシージャ/ファンク
ション名 : highlight_report_render
31. Plug-in03-07. Plug-inを作る
2018/5/19
All contents copyright Six Square Japan Co., Ltd. All Rights Reserved.
31
プラグインを作ります。(続き)
開発画面の右側に出てくるオプションの
指定をします。
今回はSQLから表を生成するため、
「リージョン?ソースはSQL文です」を
選択します。
33. Plug-in03-09. Plug-inを作る
2018/5/19
All contents copyright Six Square Japan Co., Ltd. All Rights Reserved.
33
プラグインを作ります。(続き)
アプリケーションビルダーから見えるヘルプを入力します。大事な
ので入力することをお勧めします。
---
SQL結果を表にして、特定の行をハイライトするプラグインです。
34. Plug-in03-09. Plug-inを作る
2018/5/19
All contents copyright Six Square Japan Co., Ltd. All Rights Reserved.
34
プラグインを作ります。(続き)
プラグインの作成をしますが、CSSの登録をまだしてい
ません。こちらは作成後に登録します。
SQLソースの細かい設定も作成後になります。
35. Plug-in03-10. Plug-inを作る
2018/5/19
All contents copyright Six Square Japan Co., Ltd. All Rights Reserved.
35
プラグインを作ります。(続き)
共有コンポーネント > プラグイン > プラグイン名 > ファイル
CSSを登録します。以下のファイルを作成し、アップロードしてください。
ファイル名:highlight.css
内容:
.highlight {
background: #86E0E0
}
36. Plug-in03-11. Plug-inを作る
2018/5/19
All contents copyright Six Square Japan Co., Ltd. All Rights Reserved.
36
プラグインを作ります。(続き)
共有コンポーネント > プラグイン > プラグイン名
> 標準属性の追加メタデータ > Region Source is SQL Statement
【設定】列の数を指定します。リージョンに指定され
たSQLが、ここで指定された列の数と一致しない場合
エラーを戻します。
必須:はい
最小列数:3
最大列数:3
37. Plug-in03-11. Plug-inを作る
2018/5/19
All contents copyright Six Square Japan Co., Ltd. All Rights Reserved.
37
プラグインを作ります。(続き)
共有コンポーネント > プラグイン > プラグイン名
> 標準属性の追加メタデータ > Region Source is SQL Statement
【ヘルプテキストと例】アプリケーションビルダーから見えるヘルプ
を入力します。大事なので入力することをお勧めします。
【ヘルプ?テキスト】
<pre>
1. 商品名(Varchar2)
2. 価格(Number)
3. ハイライト(0|1)(Number)
3のハイライトが1の場合、行を強調表示します。
</pre>
【例】
select PRODUCT
, P_VALUE
, HIGHLIGHT
from T_PRODUCTS
38. Plug-in04-01. Plug-inを使う
2018/5/19
All contents copyright Six Square Japan Co., Ltd. All Rights Reserved.
38
1. アプリケーション?ビルダーから組み込んでみましょう。
ヘルプに記載した通りにSQLを入力すれば動作します。
※ プラグインの中でSQL文の文字列結合しているため、セミコロンが
あるとエラーとなります。
2. 例えばプラグインのタグに以下クラシックレポート用のclassを入
れると見た目がAPEXぽくなります。
table class="t-Report-report"
th class="t-Report-colHead"
td class="t-Report-cell"