Manipulating Rows and Columns

Working with Columns

Hiding/showing columns

You can hide and show a column on the sheet, using the hideColumn method. It takes two parameters:

  • columnId - (number) the column id
  • state - (boolean) true - to hide the column, false - to show it
$$("ssheet").hideColumn(2, true);

Inserting a new column

To insert a new column to the left of the specified one, use the insertColumn method. The method takes the ID of the column, before which a new column will be inserted as a parameter.

$$("ssheet").insertColumn(3);

If the column id isn't specified, a new column will be inserted before the selected one.

Deleting a column

You can also delete a particular column or a range of columns by passing their id(s) to the deleteColumn method.

$$("ssheet").deleteColumn(3);
// or
$$("ssheet").deleteColumn([1, 3]);

Without the parameter, the method deletes the selected column.

Getting the column config

It's possible to get the configuration object of a column by using the getColumn. You need to pass the column id as a parameter.

var config = $$("ssheet").getColumn(5);

The method returns the column's configuration object.

Checking the column's visibility

You can check the visibility of a column by using the isColumnVisible method. The method takes the id of a column as a parameter:

var isVisible = $$("ssheet").isColumnVisible(2);

The method returns true, if the column is visible and false if it's hidden.

Working with Rows

Hiding/showing rows

You can hide and show a row in the sheet, using the hideRow method. It takes two parameters:

  • rowId - (number) the row id
  • state - (boolean) true - to hide the row, false - to show it
$$("ssheet").hideRow(2, true);

Inserting a new row

To insert a new row above the specified one, use the insertRow method. The method takes the ID of the row, above which a new row will be inserted as a parameter.

$$("ssheet").insertRow(3);

If the row id isn't specified, a new row will be inserted above the selected one.

Deleting a row

You can also delete a particular row or a range of rows by passing their id(s) to the deleteRow method.

$$("ssheet").deleteRow(3);
// or
$$("ssheet").deleteRow([1, 3]);

Without the parameter, the method deletes the selected row.

Getting the row's data

It's possible to get the data of a row by using the getRow. You need to pass the row id as a parameter.

var data = $$("ssheet").getRow(5);

The method returns an object with the row's data.

Checking the row's visibility

You can check the visibility of a row by using the isRowVisible method. The method takes the id of a column as a parameter:

var isVisible = $$("ssheet").isRowVisible(2);

The method returns true, if the row is visible and false if it's hidden.

Frozen Rows and Columns

Freezing Columns

You can "freeze" a column with data to make it always visible on the screen independently of horizontal scrolling.

To freeze columns, use the freezeColumns method. Columns are fixed starting from the very left one, so you should pass the amount of columns to freeze, starting from 0 (zero) to the method:

$$("ssheet").freezeColumns(2);

If there is no parameter / if invoked without a parameter, the method will unfreeze the frozen columns, if any.

Freezing Rows

There is also a possibility to freeze rows, to make some of them remain at the very top of the sheet.

To freeze rows, apply the freezeRows method. As a parameter you should pass the number of rows that should be frozen,starting from 0.

$$("ssheet").freezeRows(3);

Without parameters the method unfreezes the frozen rows, if there are any.

Back to top
If you have not checked yet, be sure to visit site of our main product Webix ui component library and page of javascript spreadshee product.