何を実現したいのかを書きましょう
部署内用の資産管理アプリを作成しているところですが、私はjavascriptについて初心者であることをご容赦ください。
実現したい機能は一覧表にチェックボックスを配置し、一括編集に入らなくとも、チェックマークをワンクリックした瞬間にユーザーと日時を棚卸実施者と棚卸日時として即時反映する機能です。
発生した問題やエラーメッセージを具体的に書きましょう
チェックボックスが全く表示されません。
実行したコードをコピー＆ペーストしましょう
(function() {
'use strict';
// **フィールドコードの定義**
var CHECKBOX_FIELD = 'tanaoroshi_check'; // 棚卸しチェック
var EXECUTOR_FIELD = 'tanaoroshi_executor'; // 棚卸し実施者
var TIMEDATE_FIELD = 'tanaoroshi_timedate'; // 棚卸し日時
// **チェックボックス変更時の処理（作成・編集画面 & 一覧編集）**
kintone.events.on([
'app.record.create.change.' + CHECKBOX_FIELD,
'app.record.edit.change.' + CHECKBOX_FIELD,
'app.record.index.edit.change.' + CHECKBOX_FIELD // ✅ 一覧編集で✓を入れた瞬間に反映
], function(event) {
var record = event.record;
try {
// **チェックを入れたら、現在のユーザー情報で上書き**
if (record[CHECKBOX_FIELD].value.length > 0) {
record[EXECUTOR_FIELD].value = kintone.getLoginUser().name; // 実施者を記録
record[TIMEDATE_FIELD].value = formatDateToISO(new Date()); // JST時刻を記録（ISO 8601形式）
}
} catch (error) {
event.error = "❌ チェックボックス変更時のエラー: " + error.message;
}
return event;
});
/*一覧画面表示時のチェックボックス設置*/
kintone.events.on('app.record.index.show', function(event) {
const records = event.records;
const checkboxCells = document.querySelectorAll(CHECKBOX_FIELD_GAIA);
checkboxCells.forEach((cell, index) => {
const record = records[index];
if (!cell) return;
cell.innerHTML = '';
const new_checkbox = document.createElement("div");
new_checkbox.style.height = "21px";
new_checkbox.style.width = "21px";
new_checkbox.style.margin = "auto";
new_checkbox.style.border = "1px solid black";
new_checkbox.style.cursor = "pointer";
if (record[CHECKBOX_FIELD].value.includes('済')) {
new_checkbox.textContent = '✔';
}
new_checkbox.onclick = function(){
clickCheckBox(new_checkbox.textContent === '✔', new_checkbox, record.$id, index);
};
cell.appendChild(new_checkbox);
});
});
// **編集画面 & 一覧編集画面で「実施者・日時」を編集不可にする**
kintone.events.on(['app.record.edit.show', 'app.record.create.show', 'app.record.index.edit.show'], function(event) {
var record = event.record;
try {
// **フィールドを編集不可 (readonly) にする**
event.record[EXECUTOR_FIELD].disabled = true;
event.record[TIMEDATE_FIELD].disabled = true;
} catch (error) {
event.error = "❌ フィールドを編集不可にする処理でエラー: " + error.message;
}
return event;
});
// **編集画面で保存時のバリデーション**
kintone.events.on(['app.record.edit.submit', 'app.record.create.submit'], function(event) {
var record = event.record;
var errors = [];
try {
// **デバッグ用ログを追加**
console.log("✅ 保存時チェック: ", record);
// **「棚卸し実施者」「棚卸し日時」が空であればエラー**
if (!record[EXECUTOR_FIELD].value) {
errors.push("❌ 棚卸し実施者が設定されていません。");
}
if (!record[TIMEDATE_FIELD].value) {
errors.push("❌ 棚卸し日時が設定されていません。");
}
// **エラーの内容を表示**
if (errors.length > 0) {
event.error = errors.join("\n"); // キントーンのエラーメッセージとして表示
}
} catch (error) {
errors.push("❌ 保存時のエラー: " + error.message);
event.error = errors.join("\n");
}
return event;
});
// **JST（日本時間）で日時を ISO 8601 形式（YYYY-MM-DDTHH:MM:SS+09:00）に変換**
function formatDateToISO(date) {
try {
var jstOffset = 9 * 60 * 60 * 1000; // JST（UTC+9）のオフセット（ミリ秒単位）
var localDate = new Date(date.getTime() + jstOffset); // UTCからJSTに変換
return localDate.toISOString().replace("Z", "+09:00"); // `YYYY-MM-DDTHH:MM:SS+09:00` 形式に変換
} catch (error) {
return "❌ 日付フォーマット変換エラー: " + error.message; // 失敗時はエラーメッセージを返す
}
}
})();
どこで間違えたか教示してもらえると助かります。よろしくお願いします。
