Selection

Selection provides an interactive support to highlight cell, row, or column that you select. Selection can be done through Mouse, Touch or Keyboard interaction. To enable selection, set allow-selection as true.

Selection Modes

The mode of selection can be single or range selection. The default selection mode can be set using allow-selection in e-selection-settings.
The two types of selection mode are as follows,

• Single - ej.Spreadsheet.SelectionUnit.Single
• Range - ej.Spreadsheet.SelectionUnit.Range

Selection Type

There are four types of selection in Spreadsheet,

1. Cell Selection
2. Row Selection
3. Column Selection
4. Sheet Selection

You can set default selection-type in e-selection-settings.

Cell Selection

Cell selection is used to select a single or multiple cells. It can be performed using selectRange method.
The following code example describes the above behavior,

HTML

<ej-spread-sheet id="Spreadsheet" load-complete ="loadComplete"></ej-spread-sheet>

<script type="text/javascript">
        function loadComplete(args) {
            this.XLSelection.selectRange("A1:C3");
            this.XLDragFill.positionAutoFillElement();
        }
</script>

The following output is displayed as a result of the above code example.

Row Selection

Row selection is used to select a single or multiple rows. It can be performed using selectRows method.
The following code example describes the above behavior,

HTML

<ej-spread-sheet id="Spreadsheet" load-complete ="loadComplete"></ej-spread-sheet>

<script type="text/javascript">
        function loadComplete(args) {
            this.XLSelection.selectRows(0, 2);
            this.XLDragFill.positionAutoFillElement();
        }
</script>

The following output is displayed as a result of the above code example.

NOTE

This type can be set as default by setting selection-type property in e-selection-settings as ej.Spreadsheet.SelectionType.Row

Column Selection

Column selection is used to select a single or multiple columns. It can be performed using selectColumns method.
The following code example describes the above behavior,

HTML

<ej-spread-sheet id="Spreadsheet" load-complete ="loadComplete"></ej-spread-sheet>

<script type="text/javascript">
        function loadComplete(args) {
            this.XLSelection.selectColumns(0, 2);
            this.XLDragFill.positionAutoFillElement();
        }
</script>

The following output is displayed as a result of the above code example.

NOTE

This type can be set as default by setting selection-type property in e-selection-settings as ej.Spreadsheet.SelectionType.Column

Sheet Selection

Sheet selection is used to select all cells in a worksheet. It can be performed using selectSheet method.
The following code example describes the above behavior,

HTML

<ej-spread-sheet id="Spreadsheet" load-complete ="loadComplete"></ej-spread-sheet>

<script type="text/javascript">
        function loadComplete(args) {
            this.XLSelection.selectSheet();
        }
</script>

The following output is displayed as a result of the above code example.