JavaScript

ボタンをクリック時や、画面表示時に実行するJavaScriptを設定します。

注意事項

楽々Webデータベースのバージョンアップ

  • JavaScriptは、画面のHTML構造や要素に依存した記述を行うことができますが、これらの画面内部構造は今後のバージョンアップで予告なく変更される場合があります。
  • DOM構造、要素名、CSSクラス、ID などに依存したJavaScriptは、バージョンアップ後に正常に動作しなくなる可能性があります。
  • 画面内部の構造に強く依存する実装を行う場合は、バージョンアップ後に動作確認を行ってください。

変数・オブジェクト

  • 動作不良を避けるため、既存のグローバル変数は書き換えないでください。
  • 既存のグローバル変数は、将来的に仕様変更される可能性があるため、参照しないでください。
  • 変数はスコープ内で定義したものを使用してください。

利用できる関数

関数名説明戻り値使用例
rkwaGetAppCode()実行中のアプリIDを取得します。文字列var appID = rkwaGetAppCode();
rkwaIsSubApp()実行中のアプリがサブアプリかどうかを判定します。真偽値(true / falseif (rkwaIsSubApp()) { ... }
rkwaIsPopup()現在の画面がポップアップ表示かどうかを判定します。真偽値(true / falseif (rkwaIsPopup()) { ... }

ワークフローに関する画面(申請画面、承認画面など)では上記関数は利用できません。

ページの判定方法

現在表示している画面を判定したい場合は、ページ番号を取得して条件分岐してください。

var pageNo = document.getElementsByName(rkwaGetAppCode())[0].cp.value;
if (pageNo == 20) {
    alert('登録画面です。');
}
  • rkwaGetAppCode() で実行中のアプリIDを取得し、それを元に Form の要素を取得します。
  • cp.value から現在のページ番号を取得します。
  • 取得したページ番号を使って、画面ごとに処理を分岐できます。

アプリ共通

画面名ページ番号
一覧照会.検索0
一覧照会.検索結果11
一括更新.入力1035
一括更新.結果1033
一覧ダウンロード(EXCEL)84
一覧ダウンロード(CSV)82
クロス集計.検索結果1011
クロス集計.詳細表示1019
グラフ.表示251
グラフ.一覧画面254
一件照会19
一件申請.確認413
一件申請.結果414
一件更新.入力33
一件更新.結果35
一件削除.確認43
一件削除.結果45
データをコピー.入力52
データをコピー.結果54
単票ダウンロード(PDF)2085
単票ダウンロード(帳票)6084
一時保存照会画面119
一件登録.入力20
一件登録.結果22
一括登録.入力1020
一括登録.結果1022
一覧登録(EXCEL).ファイル選択70
一覧登録(EXCEL).テンプレートダウンロード72
一覧登録(EXCEL).登録確認75
一覧登録(EXCEL).結果71
一覧登録(CSV).ファイル選択1070
一覧登録(CSV).テンプレートダウンロード1072
一覧登録(CSV).登録確認1075
一覧登録(CSV).結果1071

Excelから作成の「単票」形式で作成したアプリ

画面名ページ番号
単票ダウンロード(EXCEL)85
単票ダウンロード(PDF)1085
単票登録(EXCEL).ファイル選択4070
単票登録(EXCEL).テンプレートダウンロード4072
単票登録(EXCEL).登録確認4075
単票登録(EXCEL).結果4073
データ取り込み.ファイル選択5070
データ取り込み.登録結果5073

Excelから作成の「一覧」形式で作成したアプリ

画面名ページ番号
一覧登録(EXCEL).ファイル選択3070
一覧登録(EXCEL).テンプレートダウンロード3072
一覧登録(EXCEL).登録確認3075
一覧登録(EXCEL).結果3071

値取得・値書き込み

要素名の命名規則

JavaScript で項目の値を取得・書き込みする場合は、項目IDをもとに要素名を指定します。

対象要素名の指定方法
単票{項目ID}rakwdb_app1_main_0
{項目ID} + _ + {行index}rakwdb_app1_dtl_1_4
  • 行index には、対象行の行番号から-1した数値を指定します。(例:5行目を指定する場合は4)

単票の値取得・値書き込み

項目値取得値書き込み備考
文字列(1行)
文字列結合
文字列(複数行)
電話番号
メールアドレス
郵便番号
ドロップダウン
ドロップダウン(数値)
数値
日付
時刻
日付時刻
計算
URL
document.getElementsByName("項目ID")[0].value;document.getElementsByName("項目ID")[0] .value = "値";基本項目
ラジオボタン
ラジオボタン(数値)
document.getElementsByName("項目ID") の配列から checked の値を取得
(Array.from(document.getElementsByName("項目ID")).find(r => r.checked)?.value) ?? '')
document.getElementsByName("項目ID") の配列 の value で選択肢を特定し、 checked に true(チェックあり) または false(チェックなし) を設定
var item = document.getElementsByName("項目ID");
for (var i = 0; i < item.length; i++) {
 if (item[i].value == '値') { // チェック付けたい値
 item[i].checked = true;
 }
}
単一選択
チェックボックスdocument.getElementsByName("項目ID") の配列から checked の値を取得(チェックありを配列で取得)
Array.from(item).filter(cb => cb.checked).map(cb => cb.value)
document.getElementsByName("項目ID") の配列 の value でチェックボックスを特定し、 checked に true(チェックあり) または false(チェックなし) を設定
var item = document.getElementsByName("項目ID");
for (var i = 0; i < item.length; i++) {
 if (item[i].value == '値') { // チェック付けたい値
 item[i].checked = true;
 }
}
複数選択可
選択リストdocument.getElementsByName("項目ID")[0] の selectedOptions から値を取得(チェックありを配列で取得)
Array.from(item.selectedOptions).map(opt => opt.value)
document.getElementsByName("項目ID")[0] の options で選択肢を特定し、 selected に true(チェックあり) または false(チェックなし) を設定
var item = document.getElementsByName("項目ID")[0];
for (let i = 0; i < item.options.length; i++) {
 var p_opt = item.options[i];
 if (p_opt.value == 'aaa') {
  p_opt.selected = true;
 } else {
  p_opt.selected = false;
 }
}
複数選択可
時間量(long値)document.getElementsByName("項目ID")[0].value-書き込み不可
時間量(日)document.getElementsByName("pms_tad_" + "項目ID")[0].valuedocument.getElementsByName("pms_tad_" + "項目ID")[0].value = "値";
時間量(時間)document.getElementsByName("pms_tah_" + "項目ID")[0].valuedocument.getElementsByName("pms_tah_" + "項目ID")[0].value = "値";時間
時間量(分)document.getElementsByName("pms_tam_" + "項目ID")[0].valuedocument.getElementsByName("pms_tam_" + "項目ID")[0].value = "値";
時間量(秒)document.getElementsByName("pms_tas_" + "項目ID")[0].valuedocument.getElementsByName("pms_tas_" + "項目ID")[0].value = "値";
リッチテキスト--取得、書き込み不可
ファイル(ファイルID)
画像(ファイルID)
手書き
document.getElementsByName("項目ID")[0].value-書き込み不可
ファイル(ファイル名)
画像(ファイル名)
document.getElementsByName("項目ID")[0].nextSibling.textContent-書き込み不可
ユーザー(ユーザーID)document.getElementsByName("項目ID" + "_id")[0].valuedocument.getElementsByName("項目ID" + "_id")[0].value = "値";ユーザーID
ユーザー(ユーザー名)document.getElementsByName("項目ID")[0].valuedocument.getElementsByName("項目ID")[0].value = "値";ユーザー名
自動採番document.getElementsByName("項目ID")[0].value-書き込み不可
グループ(グループコード)document.getElementsByName("項目ID" + "_code")[0].value-IDの指定が必要のため書き込み不可
グループ(グループ名)document.getElementsByName("項目ID" + "_name")[0].value-IDの指定が必要のため書き込み不可

表の値取得・値書き込み

項目値取得値書き込み備考
文字列(1行)
文字列結合
文字列(複数行)
電話番号
メールアドレス
郵便番号
ドロップダウン
ドロップダウン(数値)
数値
日付
時刻
日付時刻
計算
URL
document.getElementsByName("項目ID" + "_行index")[0].valuedocument.getElementsByName("項目ID" + "_行index")[0].value = "値";基本項目
ラジオボタン
ラジオボタン(数値)
document.getElementsByName("項目ID" + "_行index") の配列から checked の値を取得
(Array.from(document.getElementsByName("項目ID")).find(r => r.checked)?.value) ?? '')
document.getElementsByName("項目ID" + "_行index") の配列 の value で選択肢を特定し、 checked に true(チェックあり) または false(チェックなし) を設定
var item = document.getElementsByName("項目ID");
for (var i = 0; i < item.length; i++) {
 if (item[i].value == '値') { // チェック付けたい値
 item[i].checked = true;
 }
}
単一選択
チェックボックスdocument.getElementsByName("項目ID" + "_行index") の配列から checked の値を取得(チェックありを配列で取得)
Array.from(item).filter(cb => cb.checked).map(cb => cb.value)
document.getElementsByName("項目ID" + "_行index") の配列 の value でチェックボックスを特定し、 checked に true(チェックあり) または false(チェックなし) を設定
var item = document.getElementsByName("項目ID");
for (var i = 0; i < item.length; i++) {
 if (item[i].value == '値') { // チェック付けたい値
 item[i].checked = true;
 }
}
複数選択可
選択リストdocument.getElementsByName("項目ID" + "_行index")[0] の selectedOptions から値を取得(チェックありを配列で取得)
Array.from(item.selectedOptions).map(opt => opt.value)
document.getElementsByName("項目ID" + "_行index")[0] options で選択肢を特定し、 selected に true(チェックあり) または false(チェックなし) を設定
var item = document.getElementsByName("項目ID")[0];
for (let i = 0; i < item.options.length; i++) {
 var p_opt = item.options[i];
 if (p_opt.value == 'aaa') {
  p_opt.selected = true;
 } else {
  p_opt.selected = false;
 }
}
複数選択可
時間量(long値)document.getElementsByName("項目ID" + "_行index")[0].value-書き込み不可
時間量(日)document.getElementsByName("pms_tad_" + "項目ID" + "_行index")[0].valuedocument.getElementsByName("pms_tad_" + "項目ID" + "_行index")[0].value = "値";
時間量(時間)document.getElementsByName("pms_tah_" + "項目ID" + "_行index")[0].valuedocument.getElementsByName("pms_tah_" + "項目ID" + "_行index")[0].value = "値";時間
時間量(分)document.getElementsByName("pms_tam_" + "項目ID" + "_行index")[0].valuedocument.getElementsByName("pms_tam_" + "項目ID" + "_行index")[0].value = "値";
時間量(秒)document.getElementsByName("pms_tas_" + "項目ID" + "_行index")[0].valuedocument.getElementsByName("pms_tas_" + "項目ID" + "_行index")[0].value = "値";
リッチテキスト--取得、書き込み不可
ファイル(ファイルID)
画像(ファイルID)
手書き
document.getElementsByName("項目ID" + "_行index")[0].value-書き込み不可
ファイル(ファイル名)
画像(ファイル名)
document.getElementsByName("項目ID" + "_行index")[0].nextSibling.textContent-書き込み不可
ユーザー(ユーザーID)document.getElementsByName("項目ID" + "_行index" + "_id")[0].valuedocument.getElementsByName("項目ID" + "_行index" + "_id")[0].value = "値";DBに登録される値
ユーザー(ユーザー名)document.getElementsByName("項目ID" + "_行index")[0].valuedocument.getElementsByName("項目ID" + "_行index")[0].value = "値";表示値
自動採番document.getElementsByName("項目ID" + "_行index")[0].value-書き込み不可
グループ(グループコード)document.getElementsByName("項目ID" + "_行index" + "_code")[0].value-コード
グループ(グループ名)document.getElementsByName("項目ID" + "_行index" + "_name")[0].value-表示値
表の表示件数parseInt(document.forms[0].arraycount.value);-arraycount から取得可能
フォーカスされている行番号document.forms[0].arrayfocus.value;-arrayfocus から取得可能

ボタンクリック時

ボタンクリック時に実行するJavaScriptを設定します。

(フォーム)登録ボタン
登録画面の「登録」ボタンをクリックしたときに実行するJavaScriptです。
(フォーム)更新ボタン
更新画面の「更新」ボタンをクリックしたときに実行するJavaScriptです。
(フォーム)削除ボタン
削除画面の「削除」ボタンをクリックしたときに実行するJavaScriptです。
(フォーム)類似ボタン
コピー画面の「登録」ボタンをクリックしたときに実行するJavaScriptです。
(一覧)登録ボタン
一括登録画面の「登録」ボタンをクリックしたときに実行するJavaScriptです。
(一覧)更新ボタン
一括更新画面の「更新」ボタンをクリックしたときに実行するJavaScriptです。
一件追加
JavaScriptを追加します。 JavaScript設定画面に進みます。
移動
実行順序を設定します。
チェックボックスを選択し、「最上部に移動」「上に移動」「下に移動」「最下部に移動」を押すとチェックボックスで選択した行が上下に移動します。
処理は上から順番に実行します。

JavaScript設定画面

有効
JavaScriptの有効/無効を選択します。 選択すると、表示制御を適用します。
概要
JavaScriptの説明を入力します。
JavaScript
JavaScriptを入力します。
適用
クリックすると、アプリに反映し、更新画面に遷移します。

ボタン処理を中止する方法

false を return することで、ボタンの処理を中止できます。

var result = confirm('登録してよろしいですか?');
if (!result) {
    return false;
}

画面表示時

画面表示時に実行するJavaScriptを設定します。

有効
JavaScriptの有効/無効を選択します。 選択すると、表示制御を適用します。
JavaScript
JavaScriptを入力します。
適用
クリックすると、アプリに反映します。