ReoGrid ReoGrid Web

シート保護

シートの保護とセル単位のロックの方法を説明します。

シート保護はPro版で利用可能です。


シート保護

シート保護を有効にすると、ロックされたセルの編集が禁止されます。

const ws = grid.worksheet;

// シート保護を有効化
ws.protected = true;

// シート保護を解除
ws.protected = false;

// 状態の確認
console.log(ws.protected); // boolean

セルロック

個々のセルのロック状態を設定します。シート保護が有効な場合、ロックされたセルは編集できません。

// セルをロック
ws.setCellLock(0, 0, 'locked');

// セルのロックを解除
ws.setCellLock(0, 0, 'unlocked');

// ロック状態をクリア(デフォルトに戻す)
ws.clearCellLock(0, 0);

// ロック状態の取得
const state = ws.getCellLock(0, 0);
// 'locked' | 'unlocked' | undefined

CellHandle API

ws.cell('A1').locked = 'locked';
ws.cell('A1').locked = 'unlocked';

const isProtected = ws.cell('A1').isProtected; // boolean

範囲ロック

// 範囲をロック
ws.setRangeLock(0, 0, 4, 3, 'locked');

// 範囲のロックを解除
ws.setRangeLock(0, 0, 4, 3, 'unlocked');

// 範囲のロックをクリア
ws.clearRangeLock(0, 0, 4, 3);

RangeHandle API

ws.range('A1:D5').setLock('locked');
ws.range('A1:D5').setLock('unlocked');
ws.range('A1:D5').clearLock();

保護状態の確認

// セルが保護されているか(シート保護 + セルロックを考慮)
const isProtected = ws.isCellProtected(0, 0);

// 範囲が保護されているか
const rangeProtected = ws.isRangeProtected(0, 0, 4, 3);

保護セル編集時のイベント

保護されたセルを編集しようとした場合に通知を受け取れます。

ws.onProtectedCellEdit(({ row, column }) => {
  alert(`セル (${row + 1}行, ${column + 1}列) は保護されています。`);
});

ActionManager との連携

ActionManager を通した操作も保護チェックが適用されます。

const success = grid.actionManager.execute(
  new SetCellInputAction(grid.worksheet, 0, 0, 'new value')
);
// success === false の場合、保護により拒否された

使用例:入力フォーム

ヘッダーや計算式のセルを保護し、入力欄のみ編集可能にします。

const ws = grid.worksheet;

ws.suspendRender();

// ヘッダー行を設定
ws.cell('A1').setValue('商品名').setStyle({ bold: true });
ws.cell('B1').setValue('数量').setStyle({ bold: true });
ws.cell('C1').setValue('単価').setStyle({ bold: true });
ws.cell('D1').setValue('金額').setStyle({ bold: true });

// 金額列は数式(編集不可)
for (let r = 1; r <= 5; r++) {
  ws.cell(`D${r + 1}`).value = `=B${r + 1}*C${r + 1}`;
}

// ヘッダーと金額列をロック
ws.range('A1:D1').setLock('locked');
ws.range('D2:D6').setLock('locked');

// 入力欄をアンロック
ws.range('A2:C6').setLock('unlocked');

// シート保護を有効化
ws.protected = true;

ws.resumeRender();

注意事項

  • シート保護が無効(ws.protected = false)の場合、セルロックの設定は無視され、すべてのセルが編集可能です。
  • デフォルトではセルはロックされていません(getCellLock()undefined を返す場合、保護対象外)。