SpreadJS 14
Features / Worksheet / Editor Status
In This Topic
    Editor Status
    In This Topic

    SpreadJS provides the ability to get information about the status of a cell by using editorStatus method of the Worksheet class. This method can be used to trigger events and perform specific actions in the spreadsheet whenever the edit status of a cell is changed during user interaction.

    The following types of cell status can be encountered while interacting with cells:

    The editor goes into the edit mode if the cell status is Enter or Edit.

    In SpreadJS Designer, typing and double-clicking on an empty cell will cause the cell to go into the Enter status whereas double-clicking on a non-empty cell causes the cell to go into the Edit status. Using the startEdit method is similar to double-clicking.

    If the cell is in Enter status and you click in the editor using the left mouse button, the status changes to Edit. You can navigate using arrow keys when the sheet is in edit mode.

    Using Code

    The following example displays the editor status and changes cell values according to the current cell status.

     

    JavaScript
    Copy Code
    <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, "Editor Status: Ready!");
                $("#status").text("Ready");
            } else if (statusnow === GC.Spread.Sheets.EditorStatus.enter) {
                activeSheet.setValue(0, 0, "Editor Status: Enter!");
                $("#status").text("Enter");
            } else if (statusnow === GC.Spread.Sheets.EditorStatus.edit) {
                activeSheet.setValue(0, 0, "Editor Status: Edit!");
                $("#status").text("Edit");
            }
        }
    </script>
    </head>
    <body>
        <div id="ss" style="height:700px;width:900px"></div>
        <label id="status" style="margin: 10px" />
    </body>
    
    See Also