Delete Disabled Cell Content with ContextMenu in Spreadsheet

Environment

Product	Progress® Kendo UI® Spreadsheet for jQuery
Operating System	Windows 8.1
Browser	All
Visual Studio Version	Visual Studio 2015

Description

I use the Kendo UI ContextMenu to delete rows from the Spreadsheet.

How can I delete a disabled cell in a Spreadsheet row through the Delete command from the ContextMenu?

Solution

1. Bind the select event to the ContextMenu of the Spreadsheet.
2. Determine whether the currently selected command is Delete.
3. Enable the current selection (which is the entire row) and clear it.

<div id="spreadsheet"></div>
<script>
    $(function() {
        var spreadsheet = $("#spreadsheet").kendoSpreadsheet({
                sheets: [{
                    rows: [{
                        cells: [{
                            value: "My Company",
                            enable: false
                        }]
                    }],

                }]
            }).data("kendoSpreadsheet"),
            rowContextMenu = spreadsheet.rowHeaderContextMenu();

        rowContextMenu.bind("select", function(e) {
            var command = $(e.item).text();
            var sheet = spreadsheet.activeSheet();
            var selection = sheet.selection();
            var rowsToBeDeleted = [];
            var shouldManuallyDelete = false;

            if (command == "Delete") {
                selection.forEachCell(function(row, col, cell) {
                    var enabled = cell.enable;

                    if (rowsToBeDeleted.indexOf(row) < 0) {
                        rowsToBeDeleted.push(row);
                    }

                    if (!shouldManuallyDelete && enabled === false) {
                        shouldManuallyDelete = true;
                    }
                });

                if (shouldManuallyDelete) {
                    selection.enable(true);

                    for(var i = rowsToBeDeleted.length; i > 0; i--) {
                        sheet.deleteRow(rowsToBeDeleted[i - 1]);
                    }
                }
            }
        });
    });
</script>