Skip to content

Commit 7b18e52

Browse files
mafanya23mafanya23
committed
[add] hiding/showing cols/rows api, update related guides
1 parent 010cc05 commit 7b18e52

17 files changed

+280
-11
lines changed

‎docs/api/api_overview.md‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -41,6 +41,8 @@ Parameters:
4141
| [](api/spreadsheet_getsheets_method.md) | @getshort(api/spreadsheet_getsheets_method.md) |
4242
| [](api/spreadsheet_getstyle_method.md) | @getshort(api/spreadsheet_getstyle_method.md) |
4343
| [](api/spreadsheet_getvalue_method.md) | @getshort(api/spreadsheet_getvalue_method.md) |
44+
| [](api/spreadsheet_hidecols_method.md) | @getshort(api/spreadsheet_hidecols_method.md) |
45+
| [](api/spreadsheet_hiderows_method.md) | @getshort(api/spreadsheet_hiderows_method.md) |
4446
| [](api/spreadsheet_hidesearch_method.md) | @getshort(api/spreadsheet_hidesearch_method.md) |
4547
| [](api/spreadsheet_insertlink_method.md) | @getshort(api/spreadsheet_insertlink_method.md) |
4648
| [](api/spreadsheet_islocked_method.md) | @getshort(api/spreadsheet_islocked_method.md) |
@@ -58,6 +60,8 @@ Parameters:
5860
| [](api/spreadsheet_setstyle_method.md) | @getshort(api/spreadsheet_setstyle_method.md) |
5961
| [](api/spreadsheet_setvalidation_method.md) | @getshort(api/spreadsheet_setvalidation_method.md) |
6062
| [](api/spreadsheet_setvalue_method.md) | @getshort(api/spreadsheet_setvalue_method.md) |
63+
| [](api/spreadsheet_showcols_method.md) | @getshort(api/spreadsheet_showcols_method.md) |
64+
| [](api/spreadsheet_showrows_method.md) | @getshort(api/spreadsheet_showrows_method.md) |
6165
| [](api/spreadsheet_startedit_method.md) | @getshort(api/spreadsheet_startedit_method.md) |
6266
| [](api/spreadsheet_undo_method.md) | @getshort(api/spreadsheet_undo_method.md) |
6367
| [](api/spreadsheet_unlock_method.md) | @getshort(api/spreadsheet_unlock_method.md) |

‎docs/api/overview/actions_overview.md‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -74,6 +74,7 @@ spreadsheet.events.on("beforeColumnAdd", function(cell){
7474
| **setValidation** | The action is executed when setting data validation for a cell |
7575
| **sortCells** | The action is executed when sorting data in spreadsheet |
7676
| **setCellStyle** | The action is executed when changing the style of a cell |
77+
| **toggleVisibility** | The action is executed when hiding/showing a column or a row |
7778
| **unmerge** | The action is executed when splitting cells |
7879

7980
**Change log:**

‎docs/api/overview/methods_overview.md‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -24,6 +24,8 @@ description: You can have a Methods overview of the DHTMLX JavaScript Spreadshee
2424
| [](../spreadsheet_getformula_method.md) | @getshort(../spreadsheet_getformula_method.md) |
2525
| [](../spreadsheet_getsheets_method.md) | @getshort(../spreadsheet_getsheets_method.md) |
2626
| [](../spreadsheet_getstyle_method.md) | @getshort(../spreadsheet_getstyle_method.md) |
27+
| [](../spreadsheet_hidecols_method.md) | @getshort(../spreadsheet_hidecols_method.md) |
28+
| [](../spreadsheet_hiderows_method.md) | @getshort(../spreadsheet_hiderows_method.md) |
2729
| [](../spreadsheet_hidesearch_method.md) | @getshort(../spreadsheet_hidesearch_method.md) |
2830
| [](../spreadsheet_getvalue_method.md) | @getshort(../spreadsheet_getvalue_method.md) |
2931
| [](../spreadsheet_insertlink_method.md) | @getshort(../spreadsheet_insertlink_method.md) |
@@ -42,6 +44,8 @@ description: You can have a Methods overview of the DHTMLX JavaScript Spreadshee
4244
| [](../spreadsheet_setstyle_method.md) | @getshort(../spreadsheet_setstyle_method.md) |
4345
| [](../spreadsheet_setvalidation_method.md) | @getshort(../spreadsheet_setvalidation_method.md) |
4446
| [](../spreadsheet_setvalue_method.md) | @getshort(../spreadsheet_setvalue_method.md) |
47+
| [](../spreadsheet_showcols_method.md) | @getshort(../spreadsheet_showcols_method.md) |
48+
| [](../spreadsheet_showrows_method.md) | @getshort(../spreadsheet_showrows_method.md) |
4549
| [](../spreadsheet_startedit_method.md) | @getshort(../spreadsheet_startedit_method.md) |
4650
| [](../spreadsheet_undo_method.md) | @getshort(../spreadsheet_undo_method.md) |
4751
| [](../spreadsheet_unlock_method.md) | @getshort(../spreadsheet_unlock_method.md) |

‎docs/api/spreadsheet_hidecols_method.md‎

Lines changed: 38 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,38 @@
1+
---
2+
sidebar_label: hideCols()
3+
title: hideCols method
4+
description: You can learn about the hideCols method in the documentation of the DHTMLX JavaScript Spreadsheet library. Browse developer guides and API reference, try out code examples and live demos, and download a free 30-day evaluation version of DHTMLX Spreadsheet.
5+
---
6+
7+
# hideCols()
8+
9+
### Description
10+
11+
@short: Hides columns
12+
13+
### Usage
14+
15+
~~~jsx
16+
hideCols(cell?: string): void;
17+
~~~
18+
19+
### Parameters
20+
21+
- `cell` - (optional) the id of the cell used to define the id of a column. If the cell id isn't passed, the currently selected cell will be used
22+
23+
### Example
24+
25+
~~~jsx
26+
spreadsheet.hideCols("B2"); // the "B" column will be hidden
27+
spreadsheet.hideCols("sheet2!B2"); // the column "B" in "sheet2" will be hidden
28+
spreadsheet.hideCols("B2:C2"); // the "B" and "C" columns will be hidden
29+
~~~
30+
31+
32+
**Related article:** [Work with Spreadsheet](working_with_ssheet.md/#hidingshowing-rows-and-columns)
33+
34+
**Related API:** [`showCols()`](api/spreadsheet_showcols_method.md)
35+
36+
**Related sample:** [Spreadsheet. Hiding columns and rows via API](https://snippet.dhtmlx.com/zere1ote)
37+
38+
**Change log:** Added in v5.2

‎docs/api/spreadsheet_hiderows_method.md‎

Lines changed: 37 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,37 @@
1+
---
2+
sidebar_label: hideRows()
3+
title: hideRows method
4+
description: You can learn about the hideRows method in the documentation of the DHTMLX JavaScript Spreadsheet library. Browse developer guides and API reference, try out code examples and live demos, and download a free 30-day evaluation version of DHTMLX Spreadsheet.
5+
---
6+
7+
# hideRows()
8+
9+
### Description
10+
11+
@short: Hides rows
12+
13+
### Usage
14+
15+
~~~jsx
16+
hideRows(cell?: string): void;
17+
~~~
18+
19+
### Parameters
20+
21+
- `cell` - (optional) the id of the cell used to define the id of a row. If the cell id isn't passed, the currently selected cell will be used
22+
23+
### Example
24+
25+
~~~jsx
26+
spreadsheet.hideRows("B2"); // the "2" row will be hidden
27+
spreadsheet.hideRows("sheet2!B2"); // the "2" row in "sheet2" will be hidden
28+
spreadsheet.hideRows("B2:C4"); // the rows from "2" to "4" will be hidden
29+
~~~
30+
31+
**Related article:** [Work with Spreadsheet](working_with_ssheet.md/#hidingshowing-rows-and-columns)
32+
33+
**Related API:** [`showRows()`](api/spreadsheet_showrows_method.md)
34+
35+
**Related sample:** [Spreadsheet. Hiding columns and rows via API](https://snippet.dhtmlx.com/zere1ote)
36+
37+
**Change log:** Added in v5.2

‎docs/api/spreadsheet_parse_method.md‎

Lines changed: 26 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -39,8 +39,20 @@ parse({
3939
{
4040
name?: string,
4141
id?: string,
42-
rows?: array,
43-
cols?: array,
42+
cols?: [
43+
{
44+
width?: number,
45+
hidden?: boolean,
46+
},
47+
// more column objects
48+
],
49+
rows?: [
50+
{
51+
height?: number,
52+
hidden?: boolean,
53+
},
54+
// more row objects
55+
],
4456
data: [
4557
{
4658
cell: string,
@@ -95,8 +107,12 @@ If you need to create a data set *for several sheets* at once, specify data as a
95107
- `sheets` - (required) an array of **sheet** objects. Each object has the following properties:
96108
- `name` - (optional) the sheet name
97109
- `id` - (optional) the sheet id
98-
- `rows` - (optional) an array of height objects. If not specified, the rows will have a height of 32px.
99-
- `cols` - (optional) an array of width objects. If not specified, the columns will have a width of 120px.
110+
- `rows` - (optional) an array of objects with rows configurations. Each object may contain the following properties:
111+
- `height` - (optional) the row height. If not specified, rows will have the height of 32px
112+
- `hidden` - (optional) defines the visibility of a row
113+
- `cols` - (optional) an array of objects with columns configurations. Each object may contain the following properties:
114+
- `width` - (optional) the column width. If not specified, columns will have the width of 120px
115+
- `hidden` - (optional) defines the visibility of a column
100116
- `data` - (required) an array of **cell** objects. Each object has the following properties:
101117
- `cell` - (required) the id of a cell that is formed as "id of the column + id of the row", e.g. A1
102118
- `value` - (required) the value of a cell
@@ -155,14 +171,14 @@ const data = {
155171
name: "sheet 1",
156172
id: "sheet_1",
157173
rows: [
158-
{ height: 50 }, // the height of the first row
159-
{ height: 50 }, // the height of the second row
160-
// the height of the other rows is 32
174+
{ height: 50, hidden: true }, // config of the first row
175+
{ height: 50 }, // config of the second row
176+
// the height of other rows is 32
161177
],
162178
cols: [
163-
{ width: 300 }, // the width of the first column
164-
{ width: 300 }, // the width of the second column
165-
// the width of the other columns is 120
179+
{ width: 300 }, // config of the first column
180+
{ width: 300, hidden: true }, // config of the second column
181+
// the width of other columns is 120
166182
],
167183
data: [
168184
{ cell: "A1", value: "Country" },

‎docs/api/spreadsheet_showcols_method.md‎

Lines changed: 37 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,37 @@
1+
---
2+
sidebar_label: showCols()
3+
title: showCols method
4+
description: You can learn about the showCols method in the documentation of the DHTMLX JavaScript Spreadsheet library. Browse developer guides and API reference, try out code examples and live demos, and download a free 30-day evaluation version of DHTMLX Spreadsheet.
5+
---
6+
7+
# showCols()
8+
9+
### Description
10+
11+
@short: Shows hidden columns
12+
13+
### Usage
14+
15+
~~~jsx
16+
showCols( cell?: string): void;
17+
~~~
18+
19+
### Parameters
20+
21+
- `cell` - (optional) the id of the cell used to define the id of a column. If the cell id isn't passed, the currently selected cell will be used
22+
23+
### Example
24+
25+
~~~jsx
26+
spreadsheet.showCols("B2"); // the "B" column will become visible again
27+
spreadsheet.showCols("sheet2!B2"); // the column "B" in "sheet2" will become visible again
28+
spreadsheet.showCols("B2:C2"); // the "B" and "C" columns will become visible again
29+
~~~
30+
31+
**Related article:** [Work with Spreadsheet](working_with_ssheet.md/#hidingshowing-rows-and-columns)
32+
33+
**Related API:** [`hideCols()`](api/spreadsheet_hidecols_method.md)
34+
35+
**Related sample:** [Spreadsheet. Hiding columns and rows via API](https://snippet.dhtmlx.com/zere1ote)
36+
37+
**Change log:** Added in v5.2

‎docs/api/spreadsheet_showrows_method.md‎

Lines changed: 37 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,37 @@
1+
---
2+
sidebar_label: showRows()
3+
title: showRows method
4+
description: You can learn about the showRows method in the documentation of the DHTMLX JavaScript Spreadsheet library. Browse developer guides and API reference, try out code examples and live demos, and download a free 30-day evaluation version of DHTMLX Spreadsheet.
5+
---
6+
7+
# showRows()
8+
9+
### Description
10+
11+
@short: Shows hidden rows
12+
13+
### Usage
14+
15+
~~~jsx
16+
showRows(cell?: string): void;
17+
~~~
18+
19+
### Parameters
20+
21+
- `cell` - (optional) the id of the cell used to define the id of a row. If the cell id isn't passed, the currently selected cell will be used
22+
23+
### Example
24+
25+
~~~jsx
26+
spreadsheet.showRows("B2"); // the "2" row will become visible again
27+
spreadsheet.showRows("sheet2!B2"); // the "2" row in "sheet2" will become visible again
28+
spreadsheet.showRows("B2:C2"); // the rows from "2" to "4" will become visible again
29+
~~~
30+
31+
**Related article:** [Work with Spreadsheet](working_with_ssheet.md/#hidingshowing-rows-and-columns)
32+
33+
**Related API:** [`hideRows()`](api/spreadsheet_hiderows_method.md)
34+
35+
**Related sample:** [Spreadsheet. Hiding columns and rows via API](https://snippet.dhtmlx.com/zere1ote)
36+
37+
**Change log:** Added in v5.2

‎docs/assets/hide_column_context_menu.png‎

42.1 KB
Loading

‎docs/assets/hide_columns_toolbar.png‎

42 KB
Loading

0 commit comments

Comments
 (0)