Skip to content

Commit 237b5fa

Browse files
sridhar-alagirisamysridhar-alagirisamy
authored
Merge pull request #1774 from syncfusion-content/EJ2-986040-hotfix
documentation(EJ2-986040): Need to include "Create Object Structure" section in Angular Spreadsheet UG documentation
2 parents 0201154 + b742e61 commit 237b5fa

File tree

23 files changed

+5124
-0
lines changed

23 files changed

+5124
-0
lines changed

‎Document-Processing-toc.html‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4678,6 +4678,7 @@
46784678
<li>
46794679
How To
46804680
<ul>
4681+
<li><a href="/document-processing/excel/spreadsheet/asp-net-core/how-to/create-a-object-structure">Create a object structure </a></li>
46814682
<li><a href="/document-processing/excel/spreadsheet/asp-net-core/how-to/change-active-sheet">Changing the active sheet while importing a file</a></li>
46824683
<li><a href="/document-processing/excel/spreadsheet/asp-net-core/how-to/identify-the-context-menu-opened">Identify the context menu opened</a></li>
46834684
</ul>
@@ -4728,6 +4729,7 @@
47284729
<li>
47294730
How To
47304731
<ul>
4732+
<li><a href="/document-processing/excel/spreadsheet/asp-net-mvc/how-to/create-a-object-structure">Create a object structure </a></li>
47314733
<li><a href="/document-processing/excel/spreadsheet/asp-net-mvc/how-to/change-active-sheet">Changing the active sheet while importing a file</a></li>
47324734
<li><a href="/document-processing/excel/spreadsheet/asp-net-mvc/how-to/identify-the-context-menu-opened">Identify the context menu opened</a></li>
47334735
</ul>
@@ -4780,6 +4782,7 @@
47804782
<li>
47814783
How To
47824784
<ul>
4785+
<li><a href="/document-processing/excel/spreadsheet/angular/how-to/create-a-object-structure">Create a object structure </a></li>
47834786
<li><a href="/document-processing/excel/spreadsheet/angular/how-to/change-active-sheet">Changing the active sheet while importing a file</a></li>
47844787
<li><a href="/document-processing/excel/spreadsheet/angular/how-to/identify-the-context-menu-opened">Identify the context menu opened</a></li>
47854788
</ul>
@@ -4878,6 +4881,7 @@
48784881
<li>
48794882
How To
48804883
<ul>
4884+
<li><a href="/document-processing/excel/spreadsheet/vue/how-to/create-a-object-structure">Create a object structure </a></li>
48814885
<li><a href="/document-processing/excel/spreadsheet/vue/how-to/change-active-sheet">Changing the active sheet while importing a file</a></li>
48824886
<li><a href="/document-processing/excel/spreadsheet/vue/how-to/identify-the-context-menu-opened">Identify the context menu opened</a></li>
48834887
</ul>

‎Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/how-to/create-a-object-structure.md‎

Lines changed: 178 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,178 @@
1+
---
2+
layout: post
3+
title: Create an object structure in ASP.NET Core Spreadsheet | Syncfusion
4+
description: Learn here all about how to create an object structure in ASP.NET Core Spreadsheet Control of Syncfusion Essential JS 2 and more.
5+
platform: document-processing
6+
control: Create a object structure
7+
documentation: ug
8+
---
9+
10+
# Create an object structure in ASP.NET Core Spreadsheet Control
11+
12+
This topic guides you to construct a JSON structure that can be passed to the `openFromJson` method to render the spreadsheet. The JSON structure is an object with the key as `Workbook` and the [`properties`](https://help.syncfusion.com/cr/aspnetcore-js2/syncfusion.ej2.spreadsheet.spreadsheet.html#properties) of the spreadsheet as value.
13+
14+
```js
15+
{ Workbook: {} }
16+
```
17+
18+
The following properties are the root level properties of the `Workbook` object.
19+
20+
| Property | Type | Description |
21+
|-------|-------|-------|
22+
| activeSheetIndex | number | Specifies active sheet index in the workbook. |
23+
| sheets | `Sheet[]` | Contains a list of sheet properties. |
24+
| definedNames | `DefineName[]` | Specifies the name for a range and uses it in the formula for calculation. |
25+
26+
The following table defines each property of the `Sheet`.
27+
28+
| Property | Type | Description |
29+
|-------|-------|-------|
30+
| name | string | Specifies the name of the sheet. |
31+
| selectedRange | string | Specifies selected range in the sheet. |
32+
| activeCell | string | Specifies active cell within `selectedRange` in the sheet. |
33+
| topLeftCell | string | Specified cell will be positioned at the upper-left corner of the sheet. |
34+
| showHeaders | boolean | Specifies to show or hide column and row headers in the sheet. |
35+
| showGridLines | boolean | Specifies to show or hide gridlines in the sheet. |
36+
| isProtected | boolean | Specifies to protect the cells in the sheet. |
37+
| state | [`SheetState`](../worksheet#sheet-visibility) | Specifies the sheet visibility state. There must be at least one visible sheet in Spreadsheet. |
38+
| columns | `Column[]` | Contains a list of column properties |
39+
| rows | `Row[]` | Contains a list of row properties |
40+
| protectSettings | [`ProtectSettings`](../protect-sheet#protect-sheet) | Configures protect and its options. |
41+
| conditionalFormats | `ConditionalFormat[]` | Specifies the conditional formatting for the sheet. |
42+
43+
The following table defines each property of the `Column`.
44+
45+
| Property | Type | Description |
46+
|-------|-------|-------|
47+
| width | number | Specifies the width of the column. |
48+
| customWidth | boolean | Specifies custom width of the column. |
49+
| hidden | boolean | To hide or show the column in the sheet. |
50+
51+
The following table defines each property of the `Row`.
52+
53+
| Property | Type | Description |
54+
|-------|-------|-------|
55+
| height | number | Specifies the height of the row. |
56+
| customHeight | boolean | Specifies the custom height of the row. |
57+
| hidden | boolean | To hide or show the row in the sheet. |
58+
| cells | `Cell[]` | Contains a list of cell properties |
59+
60+
The following table defines each property of the `Cell`.
61+
62+
| Property | Type | Description |
63+
|-------|-------|-------|
64+
| value | string | Defines the value of the cell which can be text or number. |
65+
| formula | string | Defines the formula or expression of the cell. |
66+
| format | string | Specifies the number format code to display the value in specified number format. |
67+
| hyperlink | string | Specifies the hyperlink of the cell. |
68+
| wrap | boolean | Wraps the cell text to the next line, if the text width exceeds the column width. |
69+
| isLocked | boolean | Specifies the cell whether it is locked or not, for allowing edit range in the spreadsheet protect option. |
70+
| colSpan | number | Specifies the column-wise cell merge count. |
71+
| rowSpan | number | Specifies the row-wise cell merge count. |
72+
| style | `CellStyle` | Specifies the cell style options. |
73+
| validation | `Validation` | Specifies the validation of the cell. |
74+
| image | `Image[]` | Specifies the image of the cell. |
75+
76+
The following table defines each property of the `CellStyle`.
77+
78+
| Property | Type | Description |
79+
|-------|-------|-------|
80+
| fontFamily | `FontFamily` | Specifies font family of the cell. |
81+
| verticalAlign | `VerticalAlign` | Specifies vertical align of the cell. |
82+
| textAlign | `TextAlign` | Specifies text align style of the cell. |
83+
| textIndent | string | Specifies text indent style of the cell. |
84+
| color | string | Specifies font color of the cell. |
85+
| backgroundColor | string | Specifies the background color of the cell. |
86+
| fontWeight | `FontWeight` | Specifies font weight of the cell. |
87+
| fontStyle | `FontStyle` | Specifies font style of the cell. |
88+
| fontSize | string | Specifies font size of the cell. |
89+
| textDecoration | `TextDecoration` | Specifies text decoration of the cell. |
90+
| border | string | Specifies border of the cell. |
91+
| borderTop | string | Specifies top border of the cell. |
92+
| borderBottom | string | Specifies bottom border of the cell. |
93+
| borderLeft | string | Specifies left border of the cell. |
94+
| borderRight | string | Specifies right border of the cell. |
95+
96+
```js
97+
type FontFamily = 'Arial' | 'Arial Black' | 'Axettac Demo' | 'Batang' | 'Book Antiqua' | 'Calibri' | 'Courier' | 'Courier New' | 'Din Condensed' | 'Georgia' | 'Helvetica' | 'Helvetica New' | 'Roboto' | 'Tahoma' | 'Times New Roman' | 'Verdana';
98+
type VerticalAlign = 'bottom' | 'middle' | 'top';
99+
type TextAlign = 'left' | 'center' | 'right';
100+
type FontWeight = 'bold' | 'normal';
101+
type FontStyle = 'italic' | 'normal';
102+
type TextDecoration = 'underline' | 'line-through' | 'underline line-through' | 'none';
103+
```
104+
105+
The following table defines each property of the `Validation`.
106+
107+
| Property | Type | Description |
108+
|-------|-------|-------|
109+
| type | `ValidationType` | Specifies Validation Type. |
110+
| operator | `ValidationOperator` | Specifies Validation Operator. |
111+
| value1 | string | Specifies Validation Minimum Value. |
112+
| value2 | string | Specifies Validation Maximum Value. |
113+
| ignoreBlank | boolean | Specifies IgnoreBlank option in Data Validation. |
114+
| inCellDropDown | boolean | Specifies InCellDropDown option in Data Validation. |
115+
| isHighlighted | boolean | Specifies to allow Highlight Invalid Data. |
116+
| | | |
117+
118+
```js
119+
type ValidationType = 'WholeNumber' | 'Decimal' | 'Date' | 'TextLength' | 'List' | 'Time';
120+
type ValidationOperator = 'Between' | 'NotBetween' | 'EqualTo' | 'NotEqualTo' | 'LessThan' | 'GreaterThan' | 'GreaterThanOrEqualTo' | 'LessThanOrEqualTo';
121+
```
122+
123+
The following table defines each property of the `Image`.
124+
125+
| Property | Type | Description |
126+
|-------|-------|-------|
127+
| src | string | Specifies the image source. |
128+
| id | string | Specifies image element id. |
129+
| height | number | Specifies the height of the image. |
130+
| width | number | Specifies the width of the image. |
131+
| top | number | Specifies the top position of the image. |
132+
| left | number | Specifies the left position of the image. |
133+
134+
The following table defines each property of the `ConditionalFormat`.
135+
136+
| Property | Type | Description |
137+
|-------|-------|-------|
138+
| type | `HighlightCell` or `TopBottom` or `DataBar` or `ColorScale` or `IconSet` | Specifies Conditional formatting Type. |
139+
| format | `Format` | Specifies format. |
140+
| cFColor | `CFColor` | Specifies Conditional formatting Highlight Color. |
141+
| value | string | Specifies Conditional formatting value. |
142+
| range | string | Specifies Conditional formatting range. |
143+
144+
```js
145+
type HighlightCell = 'GreaterThan' | 'LessThan' | 'Between' | 'EqualTo' | 'ContainsText' | 'DateOccur' | 'Duplicate' | 'Unique';
146+
type TopBottom = 'Top10Items' | 'Bottom10Items' | 'Top10Percentage' | 'Bottom10Percentage' | 'BelowAverage' | 'AboveAverage';
147+
type DataBar = 'BlueDataBar' | 'GreenDataBar' | 'RedDataBar' | 'OrangeDataBar' | 'LightBlueDataBar' | 'PurpleDataBar';
148+
type ColorScale = 'GYRColorScale' | 'RYGColorScale' | 'GWRColorScale' | 'RWGColorScale' | 'BWRColorScale' | 'RWBColorScale' | 'WRColorScale' | 'RWColorScale' | 'GWColorScale' | 'WGColorScale' | 'GYColorScale' | 'YGColorScale';
149+
type IconSet = 'ThreeArrows' | 'ThreeArrowsGray' | 'FourArrowsGray' | 'FourArrows' | 'FiveArrowsGray' | 'FiveArrows' | 'ThreeTrafficLights1' | 'ThreeTrafficLights2' | 'ThreeSigns' | 'FourTrafficLights' | 'FourRedToBlack' | 'ThreeSymbols' | 'ThreeSymbols2' | 'ThreeFlags' | 'FourRating' | 'FiveQuarters' | 'FiveRating' | 'ThreeTriangles' | 'ThreeStars' | 'FiveBoxes';
150+
type CFColor = 'RedFT' | 'YellowFT' | 'GreenFT' | 'RedF' | 'RedT';
151+
```
152+
153+
The following table defines each property of the `Format`.
154+
155+
| Property | Type | Description |
156+
|-------|-------|-------|
157+
| format | string | Specifies the number format code to display the value in specified number format. |
158+
| style | `CellStyle` | Specifies the cell style options. |
159+
160+
The following table defines each property of the `DefinedName`.
161+
162+
| Property | Type | Description |
163+
|-------|-------|-------|
164+
| name | string | Specifies a name for the defined name, which can be used in the formula. |
165+
| scope | string | Specifies scope for the defined name. |
166+
| comment | string | Specifies comment for the defined name. |
167+
| refersTo | string | Specifies reference for the defined name. |
168+
169+
In the following demo, the JSON structure is passed to the `openFromJson` method to render the spreadsheet in the [`created`](https://help.syncfusion.com/cr/aspnetcore-js2/syncfusion.ej2.spreadsheet.spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_Created) event.
170+
171+
{% tabs %}
172+
{% highlight cshtml tabtitle="CSHTML" %}
173+
{% include code-snippet/spreadsheet/asp-net-core/json-structure-cs1/tagHelper %}
174+
{% endhighlight %}
175+
{% highlight c# tabtitle="OpenController.cs" %}
176+
{% include code-snippet/spreadsheet/asp-net-core/json-structure-cs1/OpenController.cs %}
177+
{% endhighlight %}
178+
{% endtabs %}

0 commit comments

Comments
 (0)