編集モードと入力モード
WorksheetクラスのeditorStatusメソッドを使用すると、セルモードに関する情報を取得できます。editorStatusメソッドは、ユーザー操作によってセルモードが変更されるたびに、イベントを発生し、スプレッドシート内で特定のアクションを実行するために使用できます。
セルを操作するときに、次のいずれかのモードが表示されます。
Ready（準備完了） ：セルの一般的な状態を示します。セルを選択してアクティブセルにしたときに表示されます。
Enter（入力） ：空白セルにデータを入力するモードを示します。ユーザーが移動または選択を実行すると、現在の入力が確定されて移動または他のセルの選択が行われます。
Edit（編集） ：空白でないセル内で編集を行うモードを示します。ユーザーが移動または選択を実行すると、現在の入力は確定されずに、移動または他のセルの選択が行われます。
セルモードがEnter（入力）やEdit（編集）の場合は、エディタが編集モードになります。
SpreadJSデザイナでは、空白セルに値を入力するか、ダブルクリックすると、このセルは入力モードに切り替わります。空白以外のセルをダブルクリックすると、このセルは編集モードに切り替わります。startEditメソッドを使用すると、ダブルクリックと同様の効果が得られます。
入力モードのセルで、マウスの左ボタンを使用してエディタをクリックすると、セルモードが編集モードに変わります。編集モードのシート上では、矢印キーを使用してセル内を移動できます。
コードの使用
次のサンプルコードは、セルモードを表示し、現在のセルモードに応じてセルの値を変更します。
<script>
$(document).ready(function () {
var spread = new GC.Spread.Sheets.Workbook(document.getElementById("ss"));
var activeSheet = spread.getActiveSheet();
spread.commandManager().register("startEditing", {
canUndo: false, execute: function (context, options) {
var sheet = context.getSheetFromName(options.sheetName);
if (sheet && !sheet.isEditing()) {
sheet.startEdit();
}
}
}, 113, false, false, false, false);
setstatus(activeSheet);
activeSheet.bind(GC.Spread.Sheets.Events.EditorStatusChanged, function (e, args) {
setstatus(activeSheet, args.status);
});
});
function setstatus(activeSheet, status) {
var statusnow = status || activeSheet.editorStatus();
if (statusnow === GC.Spread.Sheets.EditorStatus.ready) {
activeSheet.setValue(0, 0, "セルモード：準備完了");
$("#status").text("準備完了");
} else if (statusnow === GC.Spread.Sheets.EditorStatus.enter) {
activeSheet.setValue(0, 0, "セルモード：入力");
$("#status").text("入力");
} else if (statusnow === GC.Spread.Sheets.EditorStatus.edit) {
activeSheet.setValue(0, 0, "セルモード：編集");
$("#status").text("編集");
}
}
</script>
</head>
<body>
<div id="ss" style="height:700px;width:900px"></div>
<label id="status" style="margin: 10px" />
</body>