XLSX: Work with cell columns on XLSX page

In This Topic

WebSpreadsheetEditorControlJS control allows to work (add, delete, copy, cut, paste, clear, resize, hide/show) with cell columns of XLSX worksheet in a web browser.

Cell columns can be changed using mouse/keyboard or programmatically.

Add the new cell column to XLSX worksheet

If you want to add the new cell column to XLSX worksheet using mouse, you should do the following steps:

Click the right mouse button on the header of the column, where you want to insert the new column, context menu will appear, select "Insert columns" menu in context menu, the new cell column will be added.

Here is JavaScript code that demonstrates how to add a cell column to XLSX worksheet:

JavaScript

// _spreadsheetDocumentEditorControl is an instance of WebSpreadsheetDocumentEditorControlJS class

// get spreadsheet editor
var spreadsheetEditorControl = _spreadsheetDocumentEditorControl.get_SpreadsheetEditorControl();

// select the entire cell column "D"
spreadsheetEditorControl.setFocusedAndSelectedCells("D:D");

// insert new cell column before column "D"
spreadsheetEditorControl.insertColumns();

Delete the cell column from XLSX worksheet

If you want to delete the cell column from XLSX worksheet using mouse, you should do the following steps:

Click the right mouse button on the header of the column, which you want to delete, context menu will appear, select "Delete columns" menu in context menu, the cell column will be deleted.

Here is JavaScript code that demonstrates how to delete the cell column from XLSX worksheet:

JavaScript

// _spreadsheetDocumentEditorControl is an instance of WebSpreadsheetDocumentEditorControlJS class

// get spreadsheet editor
var spreadsheetEditorControl = _spreadsheetDocumentEditorControl.get_SpreadsheetEditorControl();

// select the entire cell column "D"
spreadsheetEditorControl.setFocusedAndSelectedCells("D:D");

// delete the selected columns
spreadsheetEditorControl.removeColumns();

Copy and paste the cell column of XLSX worksheet

If you want to copy and paste the cell column of XLSX worksheet using mouse, you should do the following steps:

Click the right mouse button on the header of the column, which you want to copy, context menu will appear, select "Copy" menu in context menu, the cell column will be selected to copy.
Click the right mouse button on the header of the column, where you want to paste the copied column, context menu will appear, select "Paste" menu in context menu, the cell column will be pasted.

Here is JavaScript code that demonstrates how to copy and paste the cell column of XLSX worksheet:

JavaScript

// _spreadsheetDocumentEditorControl is an instance of WebSpreadsheetDocumentEditorControlJS class

// get spreadsheet editor
var spreadsheetEditorControl = _spreadsheetDocumentEditorControl.get_SpreadsheetEditorControl();

// select the entire cell column "D"
spreadsheetEditorControl.setFocusedAndSelectedCells("D:D");

// copy the selected cell column
spreadsheetEditorControl.doCopy();

// select the entire cell column "E"
spreadsheetEditorControl.setFocusedAndSelectedCells("E:E");

// copy the content of column "D" into column "E"
spreadsheetEditorControl.doPaste(false);

Cut and paste the cell column of XLSX worksheet

If you want to cut and paste the cell column of XLSX worksheet using mouse, you should do the following steps:

Click the right mouse button on the header of the column, which you want to cut, context menu will appear, select "Cut" menu in context menu, the cell column will be selected to cut.
Click the right mouse button on the header of the column, where you want to paste cutted column, context menu will appear, select "Paste" menu in context menu, the cell column will be pasted.

Here is JavaScript code that demonstrates how to cut and paste the cell column of XLSX worksheet:

JavaScript

// _spreadsheetDocumentEditorControl is an instance of WebSpreadsheetDocumentEditorControlJS class

// get spreadsheet editor
var spreadsheetEditorControl = _spreadsheetDocumentEditorControl.get_SpreadsheetEditorControl();

// select the entire cell column "D"
spreadsheetEditorControl.setFocusedAndSelectedCells("D:D");

// cut the selected cell column
spreadsheetEditorControl.doCut();

// select the entire cell column "E"
spreadsheetEditorControl.setFocusedAndSelectedCells("G:G");

// paste the content of column "D" into column "E"
spreadsheetEditorControl.doPaste(false);

Clear the content of cell column of XLSX worksheet

If you want to clear the content of the cell column of XLSX worksheet using mouse, you should do the following steps:

Click the right mouse button on the header of the column, where you want to clear the contents, context menu will appear, select "Clear Contents" menu in context menu, contents of the cell column will be cleared.

Here is JavaScript code that demonstrates how to clear the content of cell column of XLSX worksheet:

JavaScript

// _spreadsheetDocumentEditorControl is an instance of WebSpreadsheetDocumentEditorControlJS class

// get spreadsheet editor
var spreadsheetEditorControl = _spreadsheetDocumentEditorControl.get_SpreadsheetEditorControl();

// select the entire cell column "D"
spreadsheetEditorControl.setFocusedAndSelectedCells("D:D");

// clear the content of selected column
spreadsheetEditorControl.clearCellsContent();

Auto fit the width of cell column of XLSX worksheet

If you want to auto fit the width of cell column of XLSX worksheet using mouse, you should do the following steps:

Click the right mouse button on the header of the column, where you want to auto fit the width of column, context menu will appear, select "AutoFit the column width" menu in context menu, the width of cell column will be fitted automatically.

Here is JavaScript code that demonstrates how to auto fit the width of cell column of XLSX worksheet:

JavaScript

// _spreadsheetDocumentEditorControl is an instance of WebSpreadsheetDocumentEditorControlJS class

// get spreadsheet editor
var spreadsheetEditorControl = _spreadsheetDocumentEditorControl.get_SpreadsheetEditorControl();

// select the entire cell column "D"
spreadsheetEditorControl.setFocusedAndSelectedCells("D:D");

// autofit width of cell column
spreadsheetEditorControl.autoFitColumnWidth();

Hide/show the cell column of XLSX worksheet

If you want to hide/show the cell column of XLSX worksheet using mouse, you should do the following steps:

To hide the cell column: click the right mouse button on the header of the column, which you want to hide, context menu will appear, select "Hide Columns" menu in context menu, the cell columns will be hidden.
To show the hidden cell column: Click and drag the left mouse button over the previous and the next column headers to select them, click the right mouse button, context menu will appear, select "Show Columns" menu in context menu, the hidden cell column will be shown.

Here is JavaScript code that demonstrates how to hide and show the cell column of XLSX worksheet:

JavaScript

// _spreadsheetDocumentEditorControl is an instance of WebSpreadsheetDocumentEditorControlJS class

// get spreadsheet editor
var spreadsheetEditorControl = _spreadsheetDocumentEditorControl.get_SpreadsheetEditorControl();

// select the entire cell columns "D", "E", "F" and "G"
spreadsheetEditorControl.setFocusedAndSelectedCells("D:G");

// hide the selected cell columns
spreadsheetEditorControl.hideColumns();

// select the entire cell columns "E" and "F"
spreadsheetEditorControl.setFocusedAndSelectedCells("E:F");

// show the selected cell columns
spreadsheetEditorControl.showColumns();

Send Feedback