diff --git a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/accessibility.md b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/accessibility.md index 97a493c27e..b05e8e64d6 100644 --- a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/accessibility.md +++ b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/accessibility.md @@ -1,7 +1,7 @@ --- layout: post title: Accessibility in EJ2 ASP.NET CORE Spreadsheet Control -description: "Documentation for the accessibility in the Essential JS2 Spreadsheet, featuring WAI-ARIA standards." +description: "Documentation for accessibility in the Essential JS2 Spreadsheet, featuring WAI-ARIA standards." platform: document-processing control: Accessibility documentation: ug @@ -9,7 +9,7 @@ documentation: ug # Accessibility in EJ2 ASP.NET CORE Spreadsheet Control -The Spreadsheet control followed the accessibility guidelines and standards, including [ADA](https://www.ada.gov/), [Section 508](https://www.section508.gov/), [WCAG 2.2](https://www.w3.org/TR/WCAG22/) standards, and [WCAG roles](https://www.w3.org/TR/wai-aria/#roles) that are commonly used to evaluate accessibility. +The Spreadsheet control follows accessibility guidelines and standards, including [ADA](https://www.ada.gov/), [Section 508](https://www.section508.gov/), [WCAG 2.2](https://www.w3.org/TR/WCAG22/) standards, and [WCAG roles](https://www.w3.org/TR/wai-aria/#roles) that are commonly used to evaluate accessibility. The accessibility compliance for the Spreadsheet control is outlined below. @@ -39,12 +39,12 @@ The accessibility compliance for the Spreadsheet control is outlined below. ## WAI-ARIA attributes -The Spreadsheet control followed the [WAI-ARIA](https://www.w3.org/WAI/ARIA/apg/patterns/alert/) patterns to meet the accessibility. The following ARIA attributes are used in the Spreadsheet control: +The Spreadsheet control follows [WAI-ARIA](https://www.w3.org/WAI/ARIA/apg/patterns/alert/) patterns to meet the accessibility. The following ARIA attributes are used in the Spreadsheet control: | Attributes | Purpose | |-------|---------| | `grid` (role) | This role is added to the spreadsheet content table and describes the collection of rows and columns. | -| `gridcell` (role) | This role is added to the cell element and describes the rows `` element. | +| `gridcell` (role) | This role is added to a cell element and represents an individual cell within a row. | | `rowheader` (role) | This role is added to the row header and describes the header of the rows. | | `colheader` (role) | This role is added to the column header and describes the header of the columns. | | `aria-rowindex` (attribute) | This attribute describes the table's row index in the spreadsheet. | @@ -56,12 +56,14 @@ The Spreadsheet control followed the [WAI-ARIA](https://www.w3.org/WAI/ARIA/apg/ | `aria-label` (attribute) | This attribute describes the accessible name for the interactive elements. | | `textbox` (role) | This role is assigned to the textbox that accepts text input. | | `menu` (role) | This role has been added to the menu and describes the menu items. | -| `aria-expanded` (attribute) | This attribute describes the control (for example, dropdown) is expanded or collapsed. | -| `aria-multiline` (attribute) | This attribute defines what the Alt + Enter key does in the spreadsheet editor. | +| `aria-expanded` (attribute) | This attribute describes whether a control (for example, a dropdown) is expanded or collapsed. | +| `aria-multiline` (attribute) | This attribute indicates whether a textbox accepts multiple lines of input. | ## Keyboard interaction -The Spreadsheet control followed the [keyboard interaction](https://www.w3.org/WAI/ARIA/apg/patterns/alert/#keyboardinteraction) guideline, making it easy for people who use assistive technologies (AT) and those who completely rely on keyboard navigation. The following keyboard shortcuts are supported by the Spreadsheet control. +The Spreadsheet control follows [keyboard interaction](https://www.w3.org/WAI/ARIA/apg/patterns/alert/#keyboardinteraction) guidelines, making it easy for people who use assistive technologies (AT) and those who completely rely on keyboard navigation. The following keyboard shortcuts are supported by the Spreadsheet control. + +### Navigation Mode | Press | To do this | |----------|-------------| @@ -71,15 +73,15 @@ The Spreadsheet control followed the [keyboard interaction](https://www.w3.org/W | Right arrow | Navigate from the active cell to the next cell in the same row. | | Tab | Navigate the active cell to the next cell in the same row. | | Shift + Tab | Navigate the active cell to the previous cell in the same row. | -| Home | Moves the selection to starting column in worksheet. | +| Home | Move the selection to the first column in the worksheet. | | Ctrl + Home | Move the selection to the first visible cell on a worksheet. | | Shift + Home | Extend the cell selection to the first column of a worksheet. | | Ctrl + Shift + Home | Extend the selection of cells to the beginning of the worksheet. | -| Ctrl + End | Move to the last cell on a worksheet, right most last column and last row cell. | +| Ctrl + End | Move the selection to the last cell in the worksheet (the intersection of the last row and last column). | | Page Up | Move page up. | | Page Down | Move page down. | -| Shift + Page Up | Perform page up by selecting all cells between. | -| Shift + Page Down | Perform page down by selecting all cells between. | +| Shift + Page Up | Extend the selection upward by one page. | +| Shift + Page Down | Extend the selection downward by one page. | | Ctrl + Up | Navigate to the non-blank cell before the active cell in the same column. | | Ctrl + Down | Navigate to the last non-blank cell in the same column as the active cell. | | Ctrl + Left | Navigate to the non-blank cell before the active cell in the same row. | @@ -94,14 +96,26 @@ The Spreadsheet control followed the [keyboard interaction](https://www.w3.org/W | Ctrl + Shift + Right | Extend the cell selection to the last non-blank cell in the same row as the active cell. | | Enter | Navigate the active cell to the next cell in the same column. | | Shift + Enter | Navigate to the previous cell in the same column from the active cell. | -| Alt + Enter | While editing, add a new line. | + + +### Edit Mode + +| Press | To do this | +|----------|-------------| +| Alt + Enter | Insert a new line while editing a cell. | | Enter | Complete the cell editing and select the cell below in the same column. | | Shift + Enter | Complete the cell editing and select the cell above in the same column. | | Tab | Complete the cell editing and select the next cell in the same row. | | Shift + Tab | Complete the cell editing and select the previous cell in the same row. | + + +### Ribbon Navigation + +| Press | To do this | +|----------|-------------| | Alt | Focus on the active ribbon tab. | -| Left | Move the focus to the previous items in the ribbon content. | -| Right | Move the focus to the next items in the ribbon content. | +| Left arrow | Move the focus to the previous item in the ribbon content. | +| Right arrow | Move the focus to the next item in the ribbon content. | | Alt + Down | Open the ribbon dropdown menu. | | Esc / Alt + Up | Close the ribbon dropdown menu. | diff --git a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/ai-assist/ai-service/using-node-js-server.md b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/ai-assist/ai-service/using-node-js-server.md index 2227a0eb6a..801f6d9f68 100644 --- a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/ai-assist/ai-service/using-node-js-server.md +++ b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/ai-assist/ai-service/using-node-js-server.md @@ -13,7 +13,7 @@ AI Assist requires a backend service to process prompts and return AI-generated ## Prerequisites -Ensure the following are available before you begin. +Before you begin, ensure that the following prerequisites are available. ### Azure OpenAI credentials @@ -163,7 +163,7 @@ Run the following command to start the server: npm start ``` -The server runs on `http://localhost:3000`. Update the AI Assist endpoint like below: +By default, the server runs at `http://localhost:3000`. Configure AI Assist to use the following endpoint: ``` http://localhost:3000/api/AIAssist/Chat @@ -231,6 +231,6 @@ npm start [Download Node.js Server](https://drive.google.com/file/d/1V3TlO_6GS3dV986I7sDizmE9kwojkOrx/view?usp=drive_link) -## See also +## See Also * [Web API (.NET) server setup](./using-web-api) diff --git a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/ai-assist/ai-service/using-web-api.md b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/ai-assist/ai-service/using-web-api.md index 857a17303a..af0eb7e72e 100644 --- a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/ai-assist/ai-service/using-web-api.md +++ b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/ai-assist/ai-service/using-web-api.md @@ -13,7 +13,7 @@ AI Assist requires a backend service to process prompts and return AI-generated ## Prerequisites -Ensure the following are available before you begin. +Before you begin, ensure that the following prerequisites are available. ### Azure OpenAI credentials @@ -193,7 +193,7 @@ Run the following command to start the Web API server: dotnet run ``` -The server runs on `https://localhost:{port}` (as defined in `launchSettings.json`). Update the AI Assist endpoint like below: +The server runs on the HTTPS URL configured in `Properties/launchSettings.json`. Replace `{port}` with the configured port and use the following AI Assist endpoint: ``` https://localhost:{port}/api/AIAssist/Chat @@ -260,6 +260,6 @@ dotnet run * [Web API Server](https://drive.google.com/file/d/13K7a89Vk4Xt7dgd4wt49q272bSVSVuz3/view?usp=drive_link) -## See also +## See Also * [Node.js server setup](./using-node-js-server) diff --git a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/ai-assist/integration.md b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/ai-assist/integration.md index 486de58b70..aac59de8fc 100644 --- a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/ai-assist/integration.md +++ b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/ai-assist/integration.md @@ -24,7 +24,7 @@ Ensure the following before integrating AI Assist: ### Add CSS references -Add the following AI Assist dependent style references to the `` section of `~/Pages/Shared/_Layout.cshtml`. +Add the Spreadsheet theme and the required AI Assist dependency styles to the `` section of `~/Pages/Shared/_Layout.cshtml`. {% tabs %} {% highlight cshtml tabtitle="~/_Layout.cshtml" %} @@ -73,11 +73,11 @@ To enable `AIAssist` in the Spreadsheet tag helper, set the [`enableAIAssist`](h {% endhighlight %} {% endtabs %} -This enables the AI Assist into the spreadsheet. +This enables AI Assist in the Spreadsheet and displays the **AI Assist** button in the Ribbon. ### Configure AI Assist Settings -Use the [`aiAssistSettings`](https://help.syncfusion.com/cr/aspnetcore-js2/syncfusion.ej2.spreadsheet.spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_AiAssistSettings) property to connect the spreadsheet to the backend server and customize the AI Assist. +Use the [`aiAssistSettings`](https://help.syncfusion.com/cr/aspnetcore-js2/syncfusion.ej2.spreadsheet.spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_AiAssistSettings) property to configure the server side request URL, prompt placeholder, and prompt suggestions. {% tabs %} {% highlight cshtml tabtitle="CSHTML" %} @@ -89,7 +89,7 @@ Use the [`aiAssistSettings`](https://help.syncfusion.com/cr/aspnetcore-js2/syncf + promptSuggestions="@(new string[] { "Summarize this sheet", "Highlight duplicate values", "Create a chart from the selected data" })"> ``` @@ -97,7 +97,7 @@ Use the [`aiAssistSettings`](https://help.syncfusion.com/cr/aspnetcore-js2/syncf {% endhighlight %} {% endtabs %} -Your Spreadsheet is now integrated with AI Assist and ready to use. +After completing this configuration, the Spreadsheet can send AI Assist prompts to the configured server side service. ## How-To Guides @@ -110,7 +110,7 @@ Your Spreadsheet is now integrated with AI Assist and ready to use. ### Undo an AI Action -All actions performed by AI Assist are recorded in the spreadsheet's undo/redo history. Press Ctrl+Z to revert any change made by the AI, just like a manual edit. +All actions performed by AI Assist are recorded in the spreadsheet's undo/redo history. Press `Ctrl + Z` to revert any change made by the AI, just like a manual edit. ### How to Customize the Request Before Sending @@ -191,8 +191,16 @@ If the AI panel displays an error message: ## API References +### Spreadsheet properties + +| Property | Type | Description | +|----------|------|-------------| +| [`enableAIAssist`](https://help.syncfusion.com/cr/aspnetcore-js2/syncfusion.ej2.spreadsheet.spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_EnableAIAssist) | `boolean` | Specifies whether AI Assist is enabled in the Spreadsheet. | + ### AI Assist Settings +The [`aiAssistSettings`](https://help.syncfusion.com/cr/aspnetcore-js2/syncfusion.ej2.spreadsheet.spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_AIAssistSettings) property contains the following options: + | Property | Type | Description | |---|---|---| | `requestUrl` | `string` | The URL of your AI server endpoint. All prompts are sent here. | @@ -276,7 +284,7 @@ Type your request in plain English — no formulas or technical knowledge needed | *"Add a line chart showing the monthly trend"* | Creates a line chart to visualize changes over time | | *"Insert a pie chart with a title called 'Revenue Split'"* | Creates a pie chart with a custom title | -## See also +## See Also * [Node.js server setup](./ai-service/using-node-js-server) * [Web API (.NET) server setup](./ai-service/using-web-api) diff --git a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/ai-assist/overview.md b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/ai-assist/overview.md index 770e12d052..6e65cebbdc 100644 --- a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/ai-assist/overview.md +++ b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/ai-assist/overview.md @@ -1,13 +1,13 @@ --- layout: post -title: AI Assist in ASP.NET Core Spreadsheet control | Syncfusion +title: AI Assist in ASP.NET Core Spreadsheet Control | Syncfusion description: Learn about the AI Assist feature in the Syncfusion ASP.NET Core Spreadsheet control and how to configure it. platform: document-processing control: AI Assist documentation: ug --- -# AI Assist in ASP.NET Core Spreadsheet control +# AI Assist in ASP.NET Core Spreadsheet Control **AI Assist** brings AI-powered capabilities directly into the spreadsheet. Instead of manually applying formatting, writing formulas, or organizing data, you can describe what you want in plain English — and the AI Assist performs the action for you. @@ -15,11 +15,11 @@ documentation: ug ## Integration -AI Assist integrates seamlessly into your ASP.NET Core Spreadsheet application with minimal configuration. This includes injecting the module, enabling the feature, configuring the backend server connection, handling events, and exploring the full range of supported prompts. +To configure AI Assist, inject the required module, enable the feature, and connect the Spreadsheet to a server-side AI service. For setup instructions, event customization, API references, troubleshooting, and example prompts, see [AI Assist Integration](./integration). -For complete setup instructions, how-to guides, API references, and prompt examples, see [AI Assist Integration](./integration). +After completing the integration, open the AI Assist panel, submit a prompt, and verify that the requested operation is applied to the active worksheet. -## How AI Assist Works in spreadsheet +## How AI Assist Works in the spreadsheet Understanding how AI Assist processes your request helps you write better prompts and get more reliable results. @@ -36,7 +36,7 @@ Once the intent is known, the spreadsheet's current data and the identified acti - **Execution** The generated instructions are applied directly to the spreadsheet. The result appears instantly in the grid, and a confirmation message is shown in the AI panel. Every change is also added to the undo history, so nothing is permanent. -## Supported Features +## Supported features AI Assist supports a wide range of spreadsheet operations through natural language prompts: @@ -48,7 +48,7 @@ AI Assist supports a wide range of spreadsheet operations through natural langua | **Formatting** | Apply styles such as bold, italic, font color, background color, number formats, and wrap text. | | **Structure Management** | Insert/delete rows and columns, merge cells, and freeze panes. | | **Clipboard Actions** | Perform cut, copy, and paste operations through AI commands. | -| **Navigation** | Perform sorting, filtering, and find & replace operations. | +| **Navigation** | Perform sorting, filtering, and Find and Replace operations. | | **Visualization** | Insert charts with multiple types, themes, titles, and sizing options. | ### Writing Effective Prompts diff --git a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/cell-range.md b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/cell-range.md index 5fa7c090e2..5b868d3aeb 100644 --- a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/cell-range.md +++ b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/cell-range.md @@ -10,16 +10,16 @@ documentation: ug # Cell Range in ASP.NET Core Spreadsheet control -A group of cells in a sheet is known as cell range. +A group of cells in a sheet is known as a cell range. ## Wrap text -Wrap text allows you to display large content as multiple lines in a single cell. By default, the wrap text support is enabled. Use the [`allowWrap`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_AllowWrap) property to enable or disable the wrap text support in spreadsheet. +Wrap text allows you to display large content as multiple lines in a single cell. By default, wrap text support is enabled. Use the [`allowWrap`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_AllowWrap) property to enable or disable the wrap text support in spreadsheet. -Wrap text can be applied or removed to a cell or range of cells in the following ways, +Wrap text can be applied to or removed from a cell or range of cells in the following ways: * Using the `wrap` property in `cell`, you can enable or disable wrap text to a cell at initial load. -* Select or deselect wrap button from ribbon toolbar to apply or remove the wrap text to the selected range. +* Select or clear the Wrap button in the Ribbon toolbar to apply or remove wrap text for the selected range. * Using the `wrap` method, you can apply or remove the wrap text once the component is loaded. The following code example shows the wrap text functionality in spreadsheet. @@ -44,21 +44,21 @@ The following features have some limitations in wrap text: ## Merge cells -Merge cells allows users to span two or more cells in the same row or column into a single cell. When cells with multiple values are merged, top-left most cell data will be the data for the merged cell. By default, the merge cells option is enabled. Use [`allowMerge`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_AllowMerge) property to enable or disable the merge cells option in spreadsheet. +Merge cells allow users to span two or more cells in the same row or column into a single cell. When cells with multiple values are merged, the top-left cell's value becomes the value of the merged cell. By default, the merge cells option is enabled. Use [`allowMerge`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_AllowMerge) property to enable or disable the merge cells option in spreadsheet. -You can merge the range of cells in the following ways, +You can merge cells in the following ways: -* Set the `rowSpan` and `colSpan` property in `cell` to merge the number of cells at initial load. -* Select the range of cells and apply merge by selecting the desired option from ribbon toolbar. -* Use `merge` method to merge the range of cells, once the component is loaded. +* Set the `rowSpan` and `colSpan` properties of a cell to merge cells during the initial rendering. +* Select a range and choose the required merge option from the Ribbon toolbar. +* Use the `merge` method to merge a range after the component is loaded. The available merge options in spreadsheet are, | Type | Action | |-------|---------| -| Merge All | Combines all the cells in a range in to a single cell (default). | -| Merge Horizontally | Combines cells in a range as row-wise. | -| Merge Vertically | Combines cells in a range as column-wise. | +| Merge All | Combines all the cells in a range into a single cell (default). | +| Merge Horizontally | Combines cells in a range row-wise. | +| Merge Vertically | Combines cells in a range column-wise. | | UnMerge | Splits the merged cells into multiple cells. | The following code example shows the merge cells operation in spreadsheet. @@ -83,42 +83,47 @@ The following features have some limitations in Merge: ## Data Validation -Data Validation is used to restrict the user from entering the invalid data. You can use the [`allowDataValidation`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_AllowDataValidation) property to enable or disable data validation. +Data Validation is used to prevent users from entering invalid data. You can use the [`allowDataValidation`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_AllowDataValidation) property to enable or disable data validation. N> * The default value for `allowDataValidation` property is `true`. ### Apply Validation -You can apply data validation to restrict the type of data or the values that users enter into a cell. +Data validation can restrict the type of data or the range of values that users enter into a cell. -You can apply data validation by using one of the following ways, +You can apply data validation in the following ways: -* Select the Data tab in the Ribbon toolbar, and then choose the Data Validation item. -* Use the `addDataValidation()` method programmatically. +* Select the required cells, open the **Data** tab in the Ribbon, and choose **Data Validation**. +* Use the `addDataValidation()` method to apply a validation rule programmatically. + +The `addDataValidation()` method requires: + +* A validation rule that defines the validation type, operator, and permitted values or formula. +* A cell or range address to which the rule is applied. ### Clear Validation -Clear validation feature is used to remove data validations from the specified ranges or the whole worksheet. +The Clear Validation feature is used to remove data validations from the specified ranges or the entire worksheet. -You can clear data validation rule by one of the following ways, +You can clear a data validation rule in one of the following ways: -* Select the Data tab in the Ribbon toolbar, and then choose the Clear Validation item. -* Use the `removeDataValidation()` method programmatically. +* Select the required cells, open the **Data** tab in the Ribbon, and choose **Clear Validation**. +* Use the `removeDataValidation()` method to remove validation programmatically. ### Highlight Invalid Data -Highlight invalid data feature is used to highlight the previously entered invalid values. +The Highlight Invalid Data feature is used to highlight previously entered invalid values. -You can highlight an invalid data by using one of the following ways, +You can highlight invalid data in one of the following ways: -* Select the Data tab in the Ribbon toolbar, and then choose the Highlight Invalid Data item. -* Use the `addInvalidHighlight()` method programmatically. +* Open the **Data** tab in the Ribbon and choose **Highlight Invalid Data**. +* Use the `addInvalidHighlight()` method to highlight invalid values programmatically. ### Clear Highlighted Invalid Data -Clear highlight feature is used to remove the highlight from invalid cells. +The Clear Highlight feature is used to remove highlights from invalid cells. -You can clear the highlighted invalid data by using the following ways, +You can clear highlighted invalid data in one of the following ways: * Select the Data tab in the Ribbon toolbar, and then choose the Clear Highlight item. * Use the `removeInvalidHighlight()` method programmatically. @@ -138,7 +143,7 @@ The Spreadsheet supports custom data validation, allowing users to define their With custom validation, you can enforce rules using logical expressions or formulas, ensuring that only valid data is entered into the Spreadsheet. -For example, consider a scenario where you want to ensure that a cell contains a number between 10 and 100. To achieve this, define a validation rule using a formula that checks if the entered value is greater than 10 and less than 100. The formula for this validation is =AND(A1>10, A1<100), where A1 refers to the cell being validated. +For example, consider a scenario where you want to ensure that a cell contains a number greater than 10 and less than 100. To achieve this, define a validation rule using a formula that checks if the entered value is greater than 10 and less than 100. The formula for this validation is =AND(A1>10, A1<100), where A1 refers to the cell being validated. When this rule is applied, the Spreadsheet evaluates the entered value against the formula. If a user enters a value outside the specified range, an alert notifies them of the invalid input. This helps users correct errors efficiently and ensures that only desired values are accepted. @@ -171,32 +176,38 @@ The following features have some limitations in Data Validation: Auto Fill is used to fill the cells with data based on adjacent cells. It also follows a pattern from adjacent cells if available. There is no need to enter the repeated data manually. You can use [`allowAutoFill`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_AllowAutoFill) property to enable/disable the auto fill support. You can also use `showFillOptions` property to enable/disable the fill option and `fillType` property to change the default auto fill option which is available in [`autoFillSettings`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_AutoFillSettings). -You can do this by one of the following ways, +The `autoFillSettings` property configures Auto Fill behavior: + +* `showFillOptions`: Specifies whether the Auto Fill Options menu is displayed after an Auto Fill operation. +* `fillType`: Specifies the default Auto Fill operation. +* `direction`: Specifies the direction in which values are filled. + +You can perform Auto Fill in the following ways: -* Using “AutoFillOptions” menu which is open, while drag and drop the cell using fill handle element. -* Use the autoFill() method programmatically. +* Drag the fill handle to the required range and select an option from the **Auto Fill Options** menu. +* Use the `autoFill()` method programmatically. -The available parameters in `autoFill()` method are, +The `autoFill()` method accepts the following parameters: | Parameter | Type | Description | |-----|------|----| | dataRange | `string` | Specifies the data range. | | fillRange | `string` | Specifies the fill range. | -| direction | `AutoFillDirection` | Specifies the direction("Up","Right","Down","Left")to be filled. | -| fillType | `AutoFillType` | Specifies the fill type("CopyCells","FillSeries","FillFormattingOnly","FillWithoutFormatting") for autofill action. | +| direction | `AutoFillDirection` | Specifies the direction ("Up", "Right", "Down", "Left") to be filled. | +| fillType | `AutoFillType` | Specifies the fill type ("CopyCells", "FillSeries", "FillFormattingOnly", "FillWithoutFormatting") for the Auto Fill action. | -In Auto Fill we have following options, +Auto Fill supports the following options: * Copy Cells * Fill Series * Fill Formatting Only * Fill Without Formatting -N>* The default auto fill option is “FillSeries” which can be referred from `fillType` property. +N>* The default Auto Fill option is `FillSeries`, which is configured through the `fillType` property. ### Copy Cells -To copy the selected cell content to the adjacent cells. You can do this by one of the following ways, +To copy the selected cell content to the adjacent cells. You can do this in one of the following ways: * Using fill handle to select the adjacent cell range and “Copy Cells” option in “AutoFillOptions” menu to fill the adjacent cells. * Using “CopyCells” as fill type in `autoFill` method to fill the adjacent cells. @@ -205,7 +216,7 @@ To copy the selected cell content to the adjacent cells. You can do this by one To fill the series of numbers, characters, or dates based on selected cell content to the adjacent cells with their formats. -You can do this by one of the following ways, +You can do this in one of the following ways: * Using fill handle to select the adjacent cell range and “Fill Series” option in “AutoFillOptions” menu to fill the adjacent cells. * Using “FillSeries” as fill type in `autoFill` method to fill the adjacent cells. @@ -214,7 +225,7 @@ You can do this by one of the following ways, To fill the cell style and number formatting based on the selected cell content to the adjacent cells without their content. -You can do this by one of the following ways, +You can do this in one of the following ways: * Using fill handle to select the adjacent cell range and “Fill Formatting Only” option in “AutoFillOptions” menu to fill the adjacent cells. * Using “FillFormattingOnly” as fill type in `autoFill` method to fill the adjacent cells. @@ -223,7 +234,7 @@ You can do this by one of the following ways, To fill series of numbers, characters, or dates based on the selected cells to the adjacent cells without their formats. -You can do this by one of the following ways, +You can do this in one of the following ways: * Using fill handle to select the adjacent cell range and “Fill Without Formatting” option in “AutoFillOptions” menu to fill the adjacent cells. * Using “FillWithoutFormatting” as fill type in `autoFill` method to fill the adjacent cells. @@ -243,16 +254,16 @@ In the following sample, you can enable/disable the fill option on the button cl ## Clear -Clear feature helps you to clear the cell contents (formulas and data), formats (including number formats, conditional formats, and borders) in a spreadsheet. When you apply clear all, both the contents and the formats will be cleared simultaneously. +Clear feature helps you to clear the cell contents (formulas and data), formats (including number formats, conditional formats, and borders) in a spreadsheet. When you apply clear All, both the contents and the formats will be cleared simultaneously. ### Apply Clear Feature -You can apply clear feature by using one of the following ways, +You can apply the Clear feature in one of the following ways: * Select the clear icon in the Ribbon toolbar under the Home Tab. * Using the `clear()` method to clear the values. -Clear has the following types in the spreadsheet, +Clear supports the following options in the Spreadsheet: | Options | Uses | |-----|------| diff --git a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/clipboard.md b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/clipboard.md index 7b8846b46a..a6b0f92942 100644 --- a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/clipboard.md +++ b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/clipboard.md @@ -10,13 +10,13 @@ documentation: ug # Clipboard in ASP.NET Core Spreadsheet control -The Spreadsheet provides support for the clipboard operations (cut, copy, and paste). Clipboard operations can be enabled or disabled by setting the [`enableClipboard`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_EnableClipboard) property in Spreadsheet. +The Spreadsheet supports clipboard operations such as cut, copy, and paste. Clipboard operations can be enabled or disabled by setting the [`enableClipboard`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_EnableClipboard) property in Spreadsheet. N> By default, the `enableClipboard` property is true. ## Cut -It is used to cut the data from selected range of cells, rows or columns in a spreadsheet and make it available in the clipboard. +Cut is used to remove data from the selected range of cells, rows, or columns and place it on the clipboard. **User Interface**: @@ -29,7 +29,7 @@ Cut can be done in one of the following ways. ## Copy -It is used to copy the data from selected range of cells, rows or columns in a spreadsheet and make it available in the clipboard. +Copy is used to duplicate data from the selected range of cells, rows, or columns and place it on the clipboard. **User Interface**: @@ -42,12 +42,12 @@ Copy can be done in one of the following ways. ## Paste -It is used to paste the clipboard data to the selected range, rows or columns. You have the following options in Paste, +Paste is used to insert clipboard data into the selected range, rows, or columns. The following paste options are available: * `Paste Special` - You can paste the values with formatting. * `Paste` - You can paste only the values without formatting. -It also performs for external clipboard operation. If you perform cut and paste, clipboard data will be cleared, whereas in copy and paste the clipboard contents will be maintained. If you perform paste inside the copied range, the clipboard data will be cleared. +External clipboard operations are also supported. If you perform cut and paste, clipboard data will be cleared, whereas in copy and paste the clipboard contents will be maintained. If you perform paste inside the copied range, the clipboard data will be cleared. **User Interface**: @@ -73,7 +73,7 @@ N> If you use the Keyboard shortcut key for cut (`Ctrl + X`) | copy (`Ctrl + C`) ## Prevent the paste functionality -The following example shows, how to prevent the paste action in spreadsheet. In [`actionBegin`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_ActionBegin) event, you can set `cancel` argument as false in paste request type. +The following example shows how to prevent the paste action in the Spreadsheet. In the [`actionBegin`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_ActionBegin) event, set the cancel argument to true for the paste request type. {% tabs %} {% highlight cshtml tabtitle="CSHTML" %} @@ -88,7 +88,7 @@ The following example shows, how to prevent the paste action in spreadsheet. In ## Limitations -* External clipboard is not fully supported while copying data from another source and pasting into a spreadsheet, it only works with basic supports (Values, Number, cell, and Text formatting). -* If you copy =SUM(A2,B2) and paste, the formula reference will change depending on the pasted cell address but we don't have support for nested formula(formula reference will be same). +* External clipboard support is limited when copying data from another source and pasting into the Spreadsheet. Only basic formatting such as values, number formatting, cell formatting, and text formatting is supported. +* If you copy `=SUM(A2,B2)` and paste it, the formula reference changes based on the destination cell address. Nested formula references are not updated in the same way. * Clipboard is not supported with conditional formatting (values only pasting). -* We have limitation while copying the whole sheet data and pasting it into another sheet. \ No newline at end of file +* There is a limitation when copying all data from a sheet and pasting it into another sheet. \ No newline at end of file diff --git a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/comment.md b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/comment.md index 4264fc9aa4..d09201e082 100644 --- a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/comment.md +++ b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/comment.md @@ -8,9 +8,9 @@ documentation: ug --- # Comment in EJ2 ASP.NET Core Spreadsheet control -The **Comment** feature allows you to add feedback to cells without changing their values, enabling contextual discussions through threaded **replies**. Unlike [Notes](./notes), Comment include advanced review tools such as **resolve** and **reopen** to track status, plus an optional **Comments Review Pane** for browsing and managing threads. +The **Comment** feature allows users to add feedback to cells without changing their values and supports contextual discussions through threaded **replies**. Unlike [Notes](./notes), Comments include advanced review tools such as **Resolve** and **Reopen** for tracking the status of discussions. The optional **Comments review pane** can be used to browse and manage comment threads. -Cells with comment display a small comment indicator; hover to preview the comment editor. This provides a clear, collaborative workflow while keeping data intact. +Cells containing comments display a small comment indicator. Hover over the indicator to preview the comment. ![Spreadsheet showing a comment](./images/spreadsheet_comment.png) @@ -21,7 +21,7 @@ The Syncfusion Spreadsheet does not automatically track user identity. To tag ne ``` ->If the author property is not set, "Guest User" will be displayed as the author for comment and replies by default. +>If the `author` property is not set, "Guest User" is displayed as the default author for comments and replies. ## Adding a comment You can add a **comment** to a cell in several ways: @@ -32,6 +32,8 @@ You can add a **comment** to a cell in several ways: * Use the `updateCell` method with the comment model to add a comment to a specific cell. * Bind comments via code-behind during initial load by associating the comment model with the cell model. +For an example that adds a comment programmatically using the `updateCell` method, see the #resolve-and-reopen section. + The image below shows that once a comment is posted, the cell displays an indicator, and the comment can be previewed on hover. ![Adding a comment in Spreadsheet](./images/spreadsheet_adding_a_comment.gif) @@ -50,8 +52,8 @@ After posting, the replies appear under the first comment in the comment editor. ## Editing a comment You can edit the content of a comment or its replies directly within the comment editor. -* **Edit first comment**: In the comment editor. Click the **"⋯" (More thread actions)** menu in the header, select the **Edit Comment**, modify the text and click **Post**. -* **Edit a reply comment**: In the comment editor, hover over the specific reply, click the **"⋯" (More actions)**, select the **Edit Comment**, modify the text and click **Post**. +* **Edit the first comment**: In the comment editor, click the **"⋯" (More thread actions)** menu in the header, select **Edit Comment**, modify the text, and click **Post**. +* **Edit a reply**: In the comment editor, hover over the reply, click the **"⋯" (More actions)** menu, select **Edit Comment**, modify the text, and click **Post**. ![Editing a comment reply in Spreadsheet](./images/spreadsheet_edit_comment.png) @@ -74,7 +76,7 @@ You can also use the `isResolved` property in the comment model when initializin // Update a cell with a comment using the updateCell method spreadsheet.updateCell({ comment: { - author: 'Chistoper', text: 'Are you completed the report', + author: 'Christopher', text: 'Have you completed the report?', createdTime: 'January 03, 2026 at 5:00 PM', // Set to true to mark the thread as resolved; false keeps it active isResolved: false, @@ -123,7 +125,7 @@ You can show or hide the "Comments" review pane using: ![Show comments in Spreadsheet](./images/spreadsheet_show_comments.gif) ### Features of the comments review pane -The "Comments" review pane is rendered within the spreadsheet interface to provide a dedicated space for managing comments efficiently. It acts as a centralized hub where you can view all comment threads, perform actions, and keep discussions organized without navigating cell by cell. +The **Comments review pane** provides a centralized view of all comments. Use it to filter, navigate, and manage comment threads without opening each cell's comment editor. The "Comments" review pane allows you to: @@ -143,6 +145,16 @@ When the review pane is open, all actions performed in the review pane or in the * Actions such as **Reply**, **Edit**, **Delete**, and **Resolve/Reopen** update both the pane and the cell comment editor instantly, ensuring consistency across the UI. * The review pane dynamically updates when comments are added, deleted, or resolved, so you always see the latest state without refreshing. +A comment object supports the following properties: + +- `author`: Specifies the author of the comment. +- `text`: Specifies the comment text. +- `createdTime`: Specifies when the comment was created. +- `isResolved`: Specifies whether the comment thread is resolved. +- `replies`: Contains the replies associated with the comment thread. + +Each reply supports the `author`, `text`, and `createdTime` properties. + ## Saving a Workbook with Comments You can save spreadsheet data along with **comments** using **File > Save As > Microsoft Excel(.xlsx)**. - **MS Excel (.xlsx)** - Preserves all **threaded comments** (modern comments). @@ -160,7 +172,7 @@ You can bind **comment thread** to cells at initial load by providing a `comment - **Comment**: `author`, `text`, `createdTime`, `isResolved` - **Replies**: A collection of replies. Each reply is an object containing its `author`, `text`, and `createdTime` (no nested replies-of-replies). -In the below sample, comments are added to a specific cell using cell data binding. The "Comments" review pane is shown initially by enabling the `showCommentsPane` property, and comments are added using `updateCell` method in the `created` event. +In the following example, a comment thread is assigned to a cell during the initial data binding. Additional comments are added using the `updateCell` method in the `created` event. The `showCommentsPane` property is enabled to display the Comments review pane when the Spreadsheet is rendered. {% tabs %} {% highlight cshtml tabtitle="CSHTML" %} @@ -171,6 +183,8 @@ In the below sample, comments are added to a specific cell using cell data bindi {% endhighlight %} {% endtabs %} +After running the sample, verify that the comment indicator appears in the configured cell and that the corresponding comment thread is displayed in the Comments review pane. + ### Important Notes * **One thread per cell**: Attach a single `comment` object per cell. New remarks should be added as replies inside the existing thread. * **Author Identity**: The author name for each comment and reply is static once set. When exporting, the author information is preserved for all comments, even if multiple authors exist in the workbook. @@ -178,7 +192,7 @@ In the below sample, comments are added to a specific cell using cell data bindi ## Limitations * **Un-posted comments are not stored**: If you type in the comment editor and close it without clicking **Post**, the entered text is not saved and will not appear when you reopen the editor. Only posted content is persisted in the comment model. -* **Comments and Notes cannot coexist**: When a cell contains comment, notes cannot be added. Similarly, if a cell already has a notes, comment cannot be added. +* **Comments and Notes cannot coexist**: When a cell contains a comment, a note cannot be added. Similarly, when a cell contains a note, a comment cannot be added. * **Comments in Print**: Comments are not included in print output. * **Non-collaborative**: Real-time multi-user synchronization is not supported. However, when exporting and re-importing the workbook, the author information for each comment and reply is preserved. diff --git a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/context-menu.md b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/context-menu.md index bada067da0..ee1eaf78ed 100644 --- a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/context-menu.md +++ b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/context-menu.md @@ -10,9 +10,9 @@ documentation: ug # Context Menu in ASP.NET Core Spreadsheet control -Context Menu is used to improve user interaction with Spreadsheet using the popup menu. This will open when right-clicking on Cell/Column Header/Row Header/ Pager in the Spreadsheet. You can use [`enableContextMenu`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_EnableContextMenu) property to enable/disable context menu. +The context menu provides quick access to Spreadsheet operations through a popup menu. It opens when a user right-clicks a cell, row header, column header, or worksheet tab. Use the [`enableContextMenu`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_EnableContextMenu) property to enable or disable the context menu. -N> The default value for the `enableContextMenu` property is `true`. +N> The default value of the `enableContextMenu` property is `true`. ## Context Menu Items in Row Cell @@ -20,13 +20,13 @@ Find the table below for default context menu items and their actions. | Context Menu items | Action | |-------|---------| -| `Cut` | Cut the selected cells data to the clipboard, you can select a cell where you want to move the data. | -| `Copy` | Copy the selected cells data to the clipboard, so that you can paste it to somewhere else. | -| `Paste` | Paste the data from clipboard to spreadsheet. | -| `Paste Special` | `Values` - Paste the data values from clipboard to spreadsheet. `Formats` - Paste the data formats from clipboard to spreadsheet. | +| `Cut` | Cut the selected cell data to the clipboard so that it can be pasted to another location. | +| `Copy` | Copy the selected cell data to the clipboard so that it can be pasted to another location. | +| `Paste` | Paste the clipboard data into the selected cells. | +| `Paste Special` | `Values` - Pastes values from the clipboard into the Spreadsheet. `Formats` - Pastes formatting from the clipboard into the Spreadsheet. | | `Filter` | Perform filtering to the selected cells based on an active cell’s value. | | `Sort` | Perform sorting to the selected range of cells by ascending or descending. | -| `Hyperlink` | Create a link in the spreadsheet to navigate to web links or cell reference within the sheet or other sheets in the Spreadsheet. | +| `Hyperlink` | Creates a hyperlink to a web page, a cell reference in the current worksheet, or a cell reference in another worksheet. | ## Context Menu Items in Row Header / Column Header @@ -34,14 +34,14 @@ Find the table below for default context menu items and their actions. | Context Menu items | Action | |-------|---------| -| `Cut` | Cut the selected row/column header data to the clipboard, you can select a cell where you want to move the data. | -| `Copy`| Copy the selected row/column header data to the clipboard, so that you can paste it to somewhere else. | -| `Paste` | Paste the data from clipboard to spreadsheet. | -| `Paste Special` | `Values` - Paste the data values from clipboard to spreadsheet. `Formats` - Paste the data formats from clipboard to spreadsheet. | -| `Insert Columns` | Insert new rows or columns into the worksheet. | -| `Delete Columns` | Delete existing rows or columns from the worksheet. | -| `Hide Columns` | Hide the rows and columns. | -| `UnHide Columns` | Show the hidden rows and columns. | +| `Cut` | Cut the selected row or column data to the clipboard so that it can be pasted to another location. | +| `Copy` | Copy the selected row or column data to the clipboard so that it can be pasted to another location. | +| `Paste` | Paste the clipboard data into the selected rows or columns. | +| `Paste Special` | `Values` - Pastes values from the clipboard into the Spreadsheet. `Formats` - Pastes formatting from the clipboard into the Spreadsheet. | +| `Insert Rows`/`Insert Columns` | Insert new rows or columns into the worksheet. | +| `Delete Rows`/`Delete Columns` | Delete existing rows or columns from the worksheet. | +| `Hide Rows`/`Hide Columns` | Hide the selected rows or columns. | +| `Unhide Rows`/`Unhide Columns` | Show the hidden rows or columns. | ## Context Menu Items in Pager @@ -53,11 +53,11 @@ Find the table below for default context menu items and their actions. | `Delete` | Delete the selected worksheet from the spreadsheet. | | `Rename` | Rename the selected worksheet. | | `Protect Sheet` | Prevent unwanted changes from others by limiting their ability to edit. | -| `Hide` |Hide the selected worksheet. | +| `Hide` | Hide the selected worksheet. | ## Context Menu Customization -You can perform the following context menu customization options in the spreadsheet +The Spreadsheet supports the following context menu customization options: * Add Context Menu Items * Remove Context Menu Items @@ -65,9 +65,9 @@ You can perform the following context menu customization options in the spreadsh ### Add Context Menu Items -You can add the custom items in context menu using the `addContextMenuItems` in `contextmenuBeforeOpen` event +Use the `addContextMenuItems` method in the `contextmenuBeforeOpen` event to add custom items to the context menu. -In this demo, Custom Item is added after the Paste item in the context menu. +In this example, a custom item is added after the **Paste** item. After running the sample, right-click a cell and verify that the custom item appears in the context menu. {% tabs %} {% highlight cshtml tabtitle="CSHTML" %} @@ -82,9 +82,9 @@ In this demo, Custom Item is added after the Paste item in the context menu. ### Remove Context Menu Items -You can remove the items in context menu using the `removeContextMenuItems` in `contextmenuBeforeOpen` event +Use the `removeContextMenuItems` method in the `contextmenuBeforeOpen` event to remove items from the context menu. -In this demo, Insert Column item has been removed from the row/column header context menu. +In this example, the **Insert Column** item is removed from the row or column header context menu. After running the sample, right-click a row or column header and verify that the item is not displayed. {% tabs %} {% highlight cshtml tabtitle="CSHTML" %} @@ -99,9 +99,9 @@ In this demo, Insert Column item has been removed from the row/column header con ### Enable/Disable Context Menu Items -You can enable/disable the items in context menu using the `enableContextMenuItems` in `contextmenuBeforeOpen` event +Use the `enableContextMenuItems` method in the `contextmenuBeforeOpen` event to enable or disable context menu items. -In this demo, Rename item is disabled in the pager context menu. +In this example, the **Rename** item is disabled in the pager context menu. After running the sample, right-click a worksheet tab and verify that the **Rename** item is disabled. {% tabs %} {% highlight cshtml tabtitle="CSHTML" %} diff --git a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/data-binding.md b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/data-binding.md index fd4e6fd4a8..0f11b56455 100644 --- a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/data-binding.md +++ b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/data-binding.md @@ -10,7 +10,7 @@ documentation: ug # Data Binding in ASP.NET Core Spreadsheet Control -The Spreadsheet uses `DataManager`, which supports both RESTful JSON data services and local JavaScript object array binding to a range. The `dataSource` property can be assigned either with the instance of `DataManager` or JavaScript object array collection. +The Spreadsheet supports binding data to a range from RESTful JSON services and local JavaScript object arrays through `DataManager`. The `dataSource` property accepts either a `DataManager` instance or a JavaScript object array collection. N> To bind data to a cell, use `cell data binding` support. @@ -31,11 +31,11 @@ Refer to the following code example for local data binding. -N> The local data source can also be provided as an instance of the `DataManager`. By default, `DataManager` uses `JsonAdaptor` for local data-binding. +N> The local datasource can also be provided as an instance of the `DataManager`. By default, `DataManager` uses `JsonAdaptor` for local data-binding. ### Customizing column data mapping -By default, when a data source is bound to a sheet, columns are auto-assigned from the data source fields sequentially. This means that the first field in the data source is assigned to Column A, the second to Column B, and so on, sequentially. However, now you can customize the column assignments by specifying the appropriate field names in the desired order using the `fieldsOrder` property. +By default, datasource fields are mapped sequentially to worksheet columns. The first field is assigned to column A, the second field to column B, and so on. You can customize the column mapping by specifying the field names in the required order using the `fieldsOrder` property. > You can customize the mapping of column data only in the local data binding support. @@ -53,7 +53,7 @@ The following code example demonstrates how to customize the mapping of column d ## Remote data -To bind remote data to the Spreadsheet control, assign service data as an instance of `DataManager` to the `dataSource` property. To interact with remote data source, provide the service endpoint `url`. +To bind remote data to the Spreadsheet, assign a `DataManager` instance configured with the service endpoint URL to the `dataSource` property. To interact with remote data source, provide the service endpoint `url`. Refer to the following code example for remote data binding. @@ -72,7 +72,7 @@ N> By default, `DataManager` uses **ODataAdaptor** for remote data-binding. ### Binding with OData services -`OData` is a standardized protocol for creating and consuming data. You can retrieve data from OData service using the DataManager. Refer to the following code example for remote Data binding using OData service. +`OData` is a standardized protocol for creating and consuming data. You can use `DataManager` to retrieve data from an OData service. The following code example demonstrates remote data binding using an OData service. {% tabs %} {% highlight cshtml tabtitle="CSHTML" %} @@ -102,7 +102,7 @@ You can use WebApiAdaptor to bind spreadsheet with Web API created using OData e ## Cell data binding -The Spreadsheet control can bind the data to individual cell in a sheet . To achieve this you can use the `value` property. +The Spreadsheet can bind data to an individual cell in a worksheet. To achieve this, use the `value` property. Refer to the following code example for cell data binding. @@ -119,21 +119,26 @@ Refer to the following code example for cell data binding. N> The cell data binding also supports formula, style, number format, and more. -## Dynamic data binding and Datasource change event +## Dynamic data binding and data source change event -You can dynamically change the datasource of the spreadsheet by changing the `dataSource` property of the `range` object of the `sheet`. The `dataSourceChanged` event handler will be triggered when editing, inserting, and deleting a row in the datasource range. This event will be triggered with a parameter named `action` which indicates the `edit`, `add` and `delete` actions for the respective ones. +You can dynamically change the data source by updating the `dataSource` property of a range in the worksheet. The `dataSourceChanged` event is triggered when a row in the data source range is edited, inserted, or deleted. The event provides an `action` argument that indicates whether the performed action is `edit`, `add`, or `delete`. The following table defines the arguments of the `dataSourceChanged` event. | Property | Type | Description | |-----|-----|-------| -| action | string | Indicates the type of action such as `edit`, `add`, and `delete` performed in the datasource range. | -| data | object[] | Modified data for `edit` action; New data for `add` action; Deleted data for `delete` action. | -| rangeIndex | number | Specifies the range index of the datasource. | -| sheetIndex | number | Specifies the sheet index of the datasource. | +| action | string | Indicates the type of action, such as `edit`, `add`, or `delete`, performed in the data source range. | +| data | object[] | Specifies the modified data for an `edit` action, new data for an `add` action, or deleted data for a `delete` action. | +| rangeIndex | number | Specifies the index of the data source range. | +| sheetIndex | number | Specifies the index of the worksheet that contains the data source. | -N> For `add` action, the value for all the fields will be `null` in the data. In the case that you do not want the primary key field to be null which needs to be updated in the backend service, you can use `edit` action after updating the primary key field to update in the backend service.

-
For inserting a row at the end of the datasource range, you should insert a row below at the end of the range to trigger the `dataSourceChanged` event with action `add`. +N> During an add action, all field values in the event data are initially `null`. If the primary key must contain a value before the data is sent to the backend service, assign the primary key and then process the change as an edit action. + +To trigger the `dataSourceChanged` event with the `add` action, insert a row immediately below the end of the data source range. + +Bind the `dataSourceChanged` event to the Spreadsheet and use its event arguments to identify whether an edit, add, or delete action occurred in the data source range. + +After running the sample, edit, insert, or delete a row in the data source range and verify that the `dataSourceChanged` event is triggered with the corresponding action. {% tabs %} {% highlight cshtml tabtitle="CSHTML" %} @@ -146,9 +151,9 @@ N> For `add` action, the value for all the fields will be `null` in the data. In ## Dynamic data binding using updateRange method -The `updateRange` method allows you to dynamically update the `dataSource` in a spreadsheet without manually iterating through each cell. This method is especially useful for efficiently applying bulk updates to a specific range within the spreadsheet. +The `updateRange` method dynamically updates the `dataSource` in the Spreadsheet without updating each cell individually. This method is especially useful for efficiently applying bulk updates to a specific range within the spreadsheet. -To use the `updateRange` method, provide the new `dataSource` and specify the starting cell for the update using the `startCell` property of the `RangeModel`. Additionally, set the `sheetIndex` to target the appropriate sheet for the update. +To use the `updateRange` method, provide the new `dataSource`, specify the starting cell using the `startCell` property of `RangeModel`, and set `sheetIndex` to identify the worksheet to update. The following code example demonstrates how to dynamically update data using the `updateRange` method. diff --git a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/docker-deployment.md b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/docker-deployment.md index 88b5a81a43..2564f3860b 100644 --- a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/docker-deployment.md +++ b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/docker-deployment.md @@ -14,13 +14,13 @@ The [**Syncfusion® Spreadsheet (also known This Docker image is the pre-defined Docker container for Syncfusion's Spreadsheet back-end functionalities. This server-side Web API project targets ASP.NET Core 8.0. -You can deploy it quickly to your infrastructure. If you want to add new functionality or customize any existing functionalities, create your own Docker file by referencing the existing [Spreadsheet Docker project](https://github.com/SyncfusionExamples/Spreadsheet-Server-Docker). +You can deploy it quickly to your infrastructure. If you want to add new functionality or customize any existing functionalities, create your own Dockerfile by referencing the existing [Spreadsheet Docker project](https://github.com/SyncfusionExamples/Spreadsheet-Server-Docker). The Spreadsheet is supported on the [JavaScript](https://www.syncfusion.com/javascript-ui-controls), [Angular](https://www.syncfusion.com/angular-ui-components), [React](https://www.syncfusion.com/react-ui-components), [Vue](https://www.syncfusion.com/vue-ui-components), [ASP.NET Core](https://www.syncfusion.com/aspnet-core-ui-controls), and [ASP.NET MVC](https://www.syncfusion.com/aspnet-mvc-ui-controls) platforms. ## Prerequisites -Have [`Docker`](https://www.docker.com/products/container-runtime#/download) installed in your environment: +Ensure that [`Docker`](https://www.docker.com/products/container-runtime#/download) is installed in your environment: * On Windows, install [`Docker for Windows`](https://hub.docker.com/editions/community/docker-ce-desktop-windows). * On macOS, install [`Docker for Mac`](https://docs.docker.com/desktop/install/mac-install/). @@ -48,7 +48,7 @@ services: - "6002:8080" ``` -**Note:** The Spreadsheet is a commercial product. It requires a valid [license key](https://help.syncfusion.com/common/essential-studio/licensing/licensing-faq/where-can-i-get-a-license-key) to use in a production environment. Please replace `YOUR_LICENSE_KEY` with the valid license key in the `docker-compose.yml` file. +**Note:** The Spreadsheet is a commercial product and requires a valid [license key](https://help.syncfusion.com/common/essential-studio/licensing/licensing-faq/where-can-i-get-a-license-key) for use in a production environment. Pleas replace `YOUR_LICENSE_KEY` with a valid license key in the `docker-compose.yml` file. **Step 3:** In a terminal tab, navigate to the directory where you've placed the `docker-compose.yml` file and execute the following: @@ -56,9 +56,16 @@ services: docker-compose up ``` -Now the Spreadsheet server Docker instance runs on localhost with the provided port number `http://localhost:6002`. Open this link in a browser and navigate to the Spreadsheet Web API open and save service at `http://localhost:6002/api/spreadsheet/open` and `http://localhost:6002/api/spreadsheet/save`. +The Spreadsheet server is now available at `http://localhost:6002`. -**Step 4:** Append the URLs of the Docker instance running services to the [`openUrl`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_OpenUrl) property as `http://localhost:6002/api/spreadsheet/open` and the [`saveUrl`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_SaveUrl) property as `http://localhost:6002/api/spreadsheet/save` in the client-side Spreadsheet control. For more information on how to get started with the Spreadsheet control, refer to this [`getting started page.`](https://ej2.syncfusion.com/aspnetcore/documentation/spreadsheet/getting-started-core) +Use the following endpoints for Spreadsheet file operations: + +* Open service: `http://localhost:6002/api/spreadsheet/open` +* Save service: `http://localhost:6002/api/spreadsheet/save` + +**Step 4:** Append the URLs of the Docker instance running services to the [`openUrl`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_OpenUrl) property as `http://localhost:6002/api/spreadsheet/open` and the [`saveUrl`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_SaveUrl) property as `http://localhost:6002/api/spreadsheet/save` in the client-side Spreadsheet control. For more information on how to get started with the Spreadsheet control, refer to this [`getting started page.`](https://ej2.syncfusion.com/aspnetcore/documentation/spreadsheet/getting-started-core). + +Add the following Spreadsheet configuration to the Razor view in which the Spreadsheet component is rendered. Configure the `OpenUrl` and `SaveUrl` properties to use the open and save endpoints exposed by the Docker container. {% tabs %} {% highlight cshtml tabtitle="CSHTML" %} @@ -69,9 +76,11 @@ Now the Spreadsheet server Docker instance runs on localhost with the provided p {% endhighlight %} {% endtabs %} -## How to configure different cultures using a Docker compose file +Run the ASP.NET Core application and verify that the Spreadsheet can open and save Excel files using the configured Docker service endpoints. + +## How to configure different cultures using a Docker Compose file -By default, the Spreadsheet Docker container is generated in the `en_US` culture. You can configure different cultures using the `LC_ALL`, `LANGUAGE`, and `LANG` environment variables in the `docker-compose.yml` file. These environment variables are replaced in the Docker file to set the specified culture for the Spreadsheet server. +By default, the Spreadsheet Docker container uses the `en_US` culture. You can configure different cultures using the `LC_ALL`, `LANGUAGE`, and `LANG` environment variables in the `docker-compose.yml` file. These environment variables are replaced in the Dockerfile to set the specified culture for the Spreadsheet server. ```yaml version: '3.4' diff --git a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/editing.md b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/editing.md index e3188b3266..2f6960cdad 100644 --- a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/editing.md +++ b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/editing.md @@ -10,34 +10,36 @@ documentation: ug # Editing in ASP.NET Core Spreadsheet control -You can edit the contents of a cell directly in the cell or by typing in the formula bar. By default, the editing feature is enabled in the spreadsheet. Use the [`allowEditing`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_AllowEditing) property to enable or disable the editing feature. +You can edit a cell's content directly in the cell or by using the formula bar. Editing is enabled by default. Use the [`allowEditing`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_AllowEditing) property to enable or disable editing in the Spreadsheet. ## Edit cell -You can start editing by one of the following ways, +You can start editing in one of the following ways: -* Double click a cell to start the edit mode. -* Press `F2` key to edit the active cell. -* Use formula bar to perform editing. -* Use `BACKSPACE` or `SPACE` key to clear the cell content and start the edit mode. -* Using the `startEdit` method. +* Double-click a cell to enter edit mode. +* Press the `F2` key to edit the active cell. +* Use the formula bar to edit the cell content. +* Press the `Backspace` or `Space` key to clear the cell content and enter edit mode. +* Use the `startEdit` method to programmatically start editing the active cell. ## Save cell -If the cell is in editable state, you can save the edited cell by one of the following ways, +When a cell is in an editable state, you can save the edited content in one of the following ways: -* Perform mouse click on any other cell rather than the current editing cell. -* Press `Enter` or `Tab` keys to save the edited cell content. -* Using the `endEdit` method. +* Click any cell other than the cell being edited. +* Press the `Enter` or `Tab` key to save the edited cell content. +* Use the `endEdit` method to programmatically save the edited cell content. ## Cancel editing -To cancel the editing without saving the changes, you can use one of the following ways, +You can cancel editing without saving the changes in one of the following ways: -* Press `ESCAPE` key, this will remove the editable state and update the unchanged cell content. -* Using the `closeEdit` method. +* Press the `Esc` key to exit edit mode and restore the original cell content. +* Use the `closeEdit` method to programmatically cancel editing without saving the changes. -The following sample shows how to prevent the editing and cell save. Here `E` column prevent the editing by using cancel argument as true in [`cellEdit`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_CellEdit) event. In `D` column, prevent saving the edited changes by using cancel argument as true in [`beforeCellSave`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_BeforeCellSave) and use `closeEdit` method in spreadsheet. +## Prevent editing and cell saving + +The following example demonstrates how to prevent cell editing and cell saving. Editing is prevented in column `E` by setting the `cancel` argument to `true` in the [`cellEdit`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_CellEdit) event. Saving edited changes is prevented in column `D` by setting the `cancel` argument to `true` in the [`beforeCellSave`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_BeforeCellSave) event and using the `closeEdit` method. {% tabs %} {% highlight cshtml tabtitle="CSHTML" %} @@ -48,11 +50,11 @@ The following sample shows how to prevent the editing and cell save. Here `E` co {% endhighlight %} {% endtabs %} - +After running the sample, verify that cells in column E cannot enter edit mode and that edited changes in column D are not saved. ## Limitations -* Text overflow in cells is not supported in Editing. +* Text overflow in cells is not supported while editing. ## See Also diff --git a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/feature-list.md b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/feature-list.md index f2eacf9d6e..ec4c84a74f 100644 --- a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/feature-list.md +++ b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/feature-list.md @@ -21,8 +21,8 @@ The following table compares Excel functionality with the availability of EJ1 an | Scrolling | Partially | Yes | - | | Selection | Yes | Yes | - | | Editing | Yes | Yes | - | -| Formulae | Yes | Partially | EJ2 supports limited number of [`most used formulas`](https://ej2.syncfusion.com/aspnetcore/documentation/spreadsheet/formulas#supported-formulas) | -| Named range | Yes | Partially | EJ2 Spreadsheet Named range supports only in workbook scope | +| Formulae | Yes | Partially | EJ2 supports a limited number of [`commonly used formulas`](https://ej2.syncfusion.com/aspnetcore/documentation/spreadsheet/formulas#supported-formulas) | +| Named range | Yes | Partially | EJ2 Spreadsheet Named Range feature is supported only at the workbook scope | | Data Binding | Yes | Yes | - | | Formatting | Yes | Yes | - | | Context menu | Yes | Yes | - | @@ -40,7 +40,7 @@ The following table compares Excel functionality with the availability of EJ1 an | Template | No | Yes | - | | Merge cells | Yes | Yes | - | | Show / Hide rows and columns | Yes | Yes | - | -| Sheet customizations | Yes | Partially | Move or copy sheet is not supported in EJ2 spreadsheet. | +| Sheet customizations | Yes | Partially | Moving or copying worksheets is not supported in the EJ2 Spreadsheet. | | Data Validation | Yes | Yes | - | | Table | Yes | No | - | | Chart | Yes | Yes | - | @@ -53,8 +53,8 @@ The following table compares Excel functionality with the availability of EJ1 an | Autofill | Yes | No | - | | Auto Sum | Yes | Yes | - | | Format painter | Yes | No | - | -| Cell Style | Yes | Partially | We can only customize the cell style in EJ2 Spreadsheet through API. | -| Protection | Yes | Partially | Custom encryption is not supported in EJ2 Spreadsheet's protect workbook. | +| Cell Style | Yes | Partially | Cell styles can be customized in the EJ2 Spreadsheet only through the API. | +| Protection | Yes | Partially | Custom encryption is not supported in the EJ2 Spreadsheet workbook protection feature. | | Find and replace | Yes | Yes | - | | Drag and Drop | Yes | No | - | | Notes | Yes | No | - | diff --git a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/filter.md b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/filter.md index b2e364b371..76c507f0b3 100644 --- a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/filter.md +++ b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/filter.md @@ -18,24 +18,26 @@ By default, the `filter` module is injected internally into Spreadsheet to perfo ## Apply filter on UI -In the active Spreadsheet, select a range of cells to filter by value of the cell. The filtering can be done by any of the following ways: +In the active Spreadsheet, select a range of cells to filter by their values. You can apply filtering in one of the following ways: -* Select the filter item in the Ribbon toolbar. -* Right-click the sheet, select the filter item in the context menu. +* Choose **Filter** from the Ribbon. +* Right-click the selected range and choose **Filter** from the context menu. * Use the `applyFilter()` method programmatically. -* Use `Ctrl + Shift + L` keyboard shortcut to apply the filter. +* Press `Ctrl + Shift + L` to apply the filter. -N> * Use `Alt + Up/Down` keyboard shortcut to open the filter dialog. +N> * Press `Alt + Up/Down` to open the filter dialog. ## Filter by criteria -The `applyFilter()` method will apply the filter UI, based on the predicate and range given in the arguments. +Use the `applyFilter()` method to apply a filter based on the specified predicate and cell range. The predicate defines the filter condition, and the range specifies the cells to which the filter is applied. N> * The `beforeFilter` event will be triggered before filtering the specified range.
* The `filterComplete` event will be triggered after the filter action is completed successfully. The following code example shows `filter` functionality in the Spreadsheet control. +After running the sample, verify that only the rows matching the specified filter criteria are displayed. + {% tabs %} {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/spreadsheet/asp-net-core/filter/tagHelper %} @@ -49,11 +51,11 @@ The following code example shows `filter` functionality in the Spreadsheet contr ## Filter by cell value -To apply a filter for a cell value, right-click the cell and choose filter -> `Filter By Selected Cell's Value` option from the menu. It applies the filter based on the value of the selected cell in the current sheet. +To filter by a cell value, right-click the cell and choose `Filter -> Filter By Selected Cell's Value` from the context menu. The filter is applied based on the value of the selected cell in the active sheet. ## Clear filter -After applying filter to a certain column, you may want to clear it to make all filtered rows visible again. It can be done in the following ways, +After applying a filter, you can clear all filters to display every row again. You can clear all filters in one of the following ways: * Choose `Clear` option in ribbon toolbar under `Filter and Sort`. It clears the filters applied in the spreadsheet for all fields. @@ -61,18 +63,20 @@ After applying filter to a certain column, you may want to clear it to make all ## Clear filter on a field -After filtering, you can clear/reset the filter for a field alone. It can be done in the following ways, +You can clear or reset the filter applied to a specific field in one of the following ways: -* Click filter icon in the column’s header and then choose `Clear Filter` option from the filter dialog. -* You can right-click on a filtered column cell and choose `Clear Filter from .` option from the context menu. -* Use the `clearFilter(field)` method programmatically, to clear the filter in a particular column. +* Click the filter icon in the column header and choose `Clear Filter` from the filter dialog. +* Right-click a cell in the filtered column and choose the corresponding `Clear Filter` option from the context menu. +* Use the `clearFilter(field)` method to programmatically clear the filter from a specific field. ## Reapply filter -When you want to reapply the filter after some changes happened in the rows. It can be done in the following ways, +After modifying the data in filtered rows, you can reapply the existing filter in one of the following ways: + +* Choose `Reapply` from `Filter and Sort` in the Ribbon. +* Right-click a filtered cell and choose `Reapply` from the context menu. -* You can choose `Reapply` option in ribbon toolbar under `Filter and Sort` to reapply the filtered columns again. -* You can right-click on a filtered cell and choose `Reapply` option from the context menu. It reapplies the filters again in the Spreadsheet for all the fields. +Reapplying updates the filtered results based on the current data. ## Known error validations @@ -96,11 +100,11 @@ The following code example shows how to get the filtered rows. ## Limitations -The following features have some limitations in Filter: +The following operations have limitations when filtering is applied: -* Insert/delete row/column between the filter applied cells. -* Merge cells with filter. -* Copy/cut paste the filter applied cells. +* Inserting or deleting rows and columns within the filtered range. +* Merging cells within the filtered range. +* Copying, cutting, or pasting cells within the filtered range. ## See Also diff --git a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/formatting.md b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/formatting.md index 7c548442fc..3e585219ad 100644 --- a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/formatting.md +++ b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/formatting.md @@ -10,7 +10,8 @@ documentation: ug # Formatting in ASP.NET Core Spreadsheet Control -Formatting options make your data easier to view and understand. The different types of formatting options in the Spreadsheet are, +Formatting options make data easier to view and understand. The Spreadsheet supports the following formatting options: + * Number Formatting * Text Formatting * Cell Formatting @@ -19,11 +20,11 @@ Formatting options make your data easier to view and understand. The different t ## Number Formatting -Number formatting provides a type for your data in the Spreadsheet. Use the [`allowNumberFormatting`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_AllowNumberFormatting) property to enable or disable the number formatting option in the Spreadsheet. The different types of number formatting supported in Spreadsheet are, +Number formatting controls how data is displayed in the Spreadsheet. Use the [`allowNumberFormatting`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_AllowNumberFormatting) property to enable or disable the number formatting option in the Spreadsheet. The Spreadsheet supports the following number formats: | Types | Format Code | Format ID | |---------|---------|---------| -| General(default) | NA | 0 | +| General (default) | NA | 0 | | Number | `0.00` | 2 | | Currency | `$#,##0.00` | NA | | Accounting | `_($* #,##0.00_);_($* (#,##0.00);_($* "-"??_);_(@_)` | 44 | @@ -37,12 +38,12 @@ Number formatting provides a type for your data in the Spreadsheet. Use the [`al Number formatting can be applied in following ways, * Using the `format` property in `cell`, you can set the desired format to each cell at initial load. -* Using the `numberFormat` method, you can set the number format to a cell or range of cells. +* Use the `numberFormat` method to apply a number format to a cell or range of cells. * Selecting the number format option from ribbon toolbar. ### Custom Number Formatting -Spreadsheet supports custom number formats to display your data as numbers, dates, times, percentages, and currency values. If the pre-defined number formats do not meet your needs, you can set your own custom formats using custom number formats dialog or `numberFormat` method. +The Spreadsheet supports custom number formats for displaying numbers, dates, times, percentages, and currency values. If the pre-defined number formats do not meet your needs, you can set your own custom formats using custom number formats dialog or `numberFormat` method. The different types of custom number format populated in the custom number format dialog are, @@ -85,9 +86,9 @@ The different types of custom number format populated in the custom number forma | Accounting | `_($* #,##0.00_);_($* (#,##0.00);_($* "-"??_);_(@_)` | 44 | | Accounting | `_(* #,##0.00_);_(* (#,##0.00);_(* "-"??_);_(@_)` | 43 | -Custom Number formatting can be applied in following ways, -* Using the `numberFormat` method, you can set your own custom number format to a cell or range of cells. -* Selecting the custom number format option from custom number formats dialog or type your own format in dialog input and then click apply button. It will apply the custom format for selected cells. +Custom number formatting can be applied in the following ways: +* Use the `numberFormat` method to apply a custom number format to a cell or range of cells. +* Select the required cells, open the number format options from the Ribbon, and choose **Custom Number Format**. Select an available format or enter a custom format code, and then click **Apply**. The following code example shows the number formatting in cell data. @@ -100,7 +101,9 @@ The following code example shows the number formatting in cell data. {% endhighlight %} {% endtabs %} -## Configure culture-based custom format +After running the sample, verify that the selected cells display values using the configured number format. + +## Configure culture-based custom formats Previously, the custom format dialog always displayed formats using the English settings (group separator, decimal separator, and currency symbol were not updated based on the applied culture). Starting from version `27.1.*`, the custom format dialog will now display formats according to the applied culture. You can select a culture-based number format from the dialog or enter your own format using the culture-specific decimal separator, group separator, and currency symbol. Then, click "Apply" to apply the culture-specific custom format to the selected cells. @@ -110,6 +113,8 @@ Compared to Excel, the date, time, currency, and accounting formats vary across > The format code should use the default decimal separator (.) and group separator (,). +Obtain the Spreadsheet instance after the component is rendered, and pass it with the collection of localized format codes to the `configureLocalizedFormat` method. The `spreadsheet` parameter represents the rendered Spreadsheet instance, and the `deLocaleFormats` parameter contains the format IDs and their corresponding culture-specific format codes. + The code below illustrates how culture-based format codes are mapped to their corresponding number format ID for the `German` culture. ```csharp @@ -144,6 +149,14 @@ ViewBag.deLocaleFormats = deLocaleFormats; ``` +To configure culture-based custom formats: + +1. Create a collection containing the default number format IDs and their corresponding culture-specific format codes. +2. Pass the collection from the controller to the Razor view. +3. Obtain the rendered Spreadsheet instance. +4. Pass the Spreadsheet instance and the format collection to the `configureLocalizedFormat` method. +5. Open the custom number format dialog and verify that the culture-specific formats are displayed. + The following code example demonstrates how to configure culture-based formats for different cultures in the spreadsheet. {% tabs %} @@ -155,9 +168,11 @@ The following code example demonstrates how to configure culture-based formats f {% endhighlight %} {% endtabs %} +After running the sample, open the custom number format dialog and verify that the configured culture-specific number formats are displayed. + ## Text and cell formatting -Text and cell formatting enhances the look and feel of your cell. It helps to highlight a particular cell or range of cells from a whole workbook. You can apply formats like font size, font family, font color, text alignment, border etc. to a cell or range of cells. Use the [`allowCellFormatting`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_AllowCellFormatting) property to enable or disable the text and cell formatting option in Spreadsheet. You can set the formats in following ways, +Text and cell formatting improve the appearance of cells and helps highlight a specific cell or range in a workbook. You can apply formats like font size, font family, font color, text alignment, border etc. to a cell or range of cells. Use the [`allowCellFormatting`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_AllowCellFormatting) property to enable or disable the text and cell formatting option in Spreadsheet. You can apply text and cell formatting in the following ways: * Using the `style` property, you can set formats to each cell at initial load. * Using the `cellFormat` method, you can set formats to a cell or range of cells. * You can also apply by clicking the desired format option from the ribbon toolbar. @@ -377,7 +392,7 @@ cells: new List() 3. You can also apply subscript and superscript dynamically using the `updateCell` method. -```csharp +```js spreadsheet.updateCell( { value: 'X2', diff --git a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/formulas.md b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/formulas.md index 481f40a2da..ca54439a33 100644 --- a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/formulas.md +++ b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/formulas.md @@ -10,20 +10,20 @@ documentation: ug # Formulas in ASP.NET Core Spreadsheet control -Formulas are used for calculating the data in a worksheet. You can refer the cell reference from same sheet or from different sheets. +Formulas are used to calculate data in a worksheet. A formula can reference cells in the same worksheet or in other worksheets. ## Usage -You can set formula for a cell in the following ways, +You can set a formula for a cell in the following ways: -* Using the `formula` property from `cell`, you can set the formula or expression to each cell at initial load. +* Use the `formula` property of a cell to set a formula or expression during the initial rendering. * Set the formula or expression through data binding. -* You can set formula for a cell by [`editing`](./editing). +* Set a formula by [`editing`](./editing) a cell. * Using the `updateCell` method, you can set or update the cell formula. ## Culture-Based Argument Separator -Previously, although you could import culture-based Excel files into the Spreadsheet control, the formulas wouldn't calculate correctly. This was due to the absence of culture-based argument separators and support for culture-based formatted numeric values as arguments. However, starting from version 25.1.35, you can now import culture-based Excel files into the Spreadsheet component. +Previously, formulas in imported culture-based Excel files were not calculated correctly because culture-based argument separators and formatted numeric values were not supported as formula arguments. Starting with version 25.1.35, the Spreadsheet supports importing culture-based Excel files with these values. > Before importing culture-based Excel files, ensure that the Spreadsheet control is rendered with the corresponding culture. Additionally, launch the import/export services with the same culture to ensure compatibility. @@ -40,11 +40,20 @@ In the example below, the Spreadsheet control is rendered with the `German cultu {% endhighlight %} {% endtabs %} +After running the sample, verify that formulas containing culture-specific argument separators and formatted numeric values are calculated correctly. + ## Create User Defined Functions / Custom Functions The Spreadsheet includes a number of built-in formulas. For your convenience, a list of supported formulas can be found [here](https://ej2.syncfusion.com/aspnetcore/documentation/spreadsheet/formulas#supported-formulas). -You can define and use an unsupported formula, i.e. a user defined/custom formula, in the spreadsheet by using the `addCustomFunction` function. Meanwhile, remember that you should define a user defined/custom formula whose results should only return a single value. If a user-defined/custom formula returns an array, it will be time-consuming to update adjacent cell values. +You can define and use a custom formula that is not built into the Spreadsheet by using the `addCustomFunction` method. A custom formula should return a single value. If a user-defined/custom formula returns an array, it will be time-consuming to update adjacent cell values. + +To create and use a custom function: + +1. Define a function that accepts the required arguments and returns a single value. +2. Register the function using the `addCustomFunction` method. +3. Use the registered function in a cell formula. +4. Verify that the target cell displays the expected result. The following code example shows an unsupported formula in the spreadsheet. @@ -57,7 +66,11 @@ The following code example shows an unsupported formula in the spreadsheet. {% endhighlight %} {% endtabs %} -Second, if you want to directly compute any formula or expression, you can use the `computeExpression` method. This method will work for both built-in and used-defined/custom formula. +After running the sample, verify that the registered custom function returns the expected value in the target cell. + +## Compute a formula or expression + +Use the `computeExpression` method to directly evaluate a built-in or custom formula or expression. This method works with both built-in and custom formulas. The following code example shows how to use `computeExpression` method in the spreadsheet. @@ -70,9 +83,11 @@ The following code example shows how to use `computeExpression` method in the sp {% endhighlight %} {% endtabs %} +After running the sample, verify that the formula or expression is evaluated and returns the expected result. + ## Formula bar -Formula bar is used to edit or enter cell data in much easier way. By default, the formula bar is enabled in the spreadsheet. Use the [`showFormulaBar`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_ShowFormulaBar) property to enable or disable the formula bar. +The formula bar allows you to enter or edit cell data more easily. By default, the formula bar is enabled in the Spreadsheet. Use the [`showFormulaBar`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_ShowFormulaBar) property to enable or disable the formula bar. ## Named Ranges @@ -120,11 +135,13 @@ The following code example demonstrates how to set the Automatic calculation mod {% endhighlight %} {% endtabs %} +After running the sample, modify a dependent cell and verify that the formula result is recalculated automatically. + ### Manual Mode In Manual Mode, formulas are not recalculated automatically when cell values are modified. Instead, recalculations must be triggered explicitly. This mode is ideal for scenarios where performance optimization is a priority, such as working with large datasets or computationally intensive formulas. -For example, imagine a spreadsheet where cell `C1` contains the formula `=A1+B1`. When the value in `A1` or `B1` changes, the value in `C1` will not update automatically. Instead, the recalculation must be initiated manually using either the `Calculate Sheet` or `Calculate Workbook` option. To manually initiate recalculation, the Spreadsheet provides two options: +For example, imagine a spreadsheet where cell `C1` contains the formula `=A1+B1`. When the value in `A1` or `B1` changes, the value in `C1` will not update automatically. Instead, the recalculation must be initiated manually using either the `Calculate Sheet` or `Calculate Workbook` option. To manually initiate recalculation, use one of the following options: * `Calculate Sheet`: Recalculates formulas for the active sheet only. * `Calculate Workbook`: Recalculates formulas across all sheets in the workbook. @@ -140,6 +157,8 @@ The following code example demonstrates how to set the Manual calculation mode i {% endhighlight %} {% endtabs %} +After running the sample, modify a dependent cell and verify that the formula result remains unchanged until **Calculate Sheet** or **Calculate Workbook** is selected. + ## Supported Formulas The following are the list of formulas supported in spreadsheet, @@ -151,7 +170,7 @@ The following are the list of formulas supported in spreadsheet, | AND | Returns TRUE if all the arguments are TRUE, otherwise returns FALSE. | | AVERAGE | Calculates average for the series of numbers and/or cells excluding text. | | AVERAGEA | Calculates the average for the cells evaluating TRUE as 1, text and FALSE as 0. | -| AVERAGEIF | Clears content of the active cell and enables edit mode. | +| AVERAGEIF | Calculates the average of cells that meet the specified condition. | | AVERAGEIFS | Calculates average for the cells based on specified conditions. | | CEILING | Rounds a number up to the nearest multiple of a given factor. | | CHOOSE | Returns a value from list of values, based on index number. | @@ -160,7 +179,7 @@ The following are the list of formulas supported in spreadsheet, | CONCAT | Concatenates a list or a range of text strings. | | CONCATENATE | Combines two or more strings together. | | COUNT | Counts the cells that contain numeric values in a range. | -| COUNTA | Counts the cells that contains values in a range. | +| COUNTA | Counts the cells that contain values in a range. | | COUNTBLANK | Returns the number of empty cells in a specified range of cells. | | COUNTIF | Counts the cells based on specified condition. | | COUNTIFS | Counts the cells based on specified conditions. | @@ -174,7 +193,7 @@ The following are the list of formulas supported in spreadsheet, | EDATE | Returns a date with given number of months before or after the specified date. | | EOMONTH | Returns the last day of the month that is a specified number of months before or after an initially supplied start date. | | EVEN | Rounds a positive number up and negative number down to the nearest even integer. | -| EXACT | Checks whether a two text strings are exactly same and returns TRUE or FALSE. | +| EXACT | Checks whether two text strings are exactly the same and returns `TRUE` or `FALSE`. | | EXP | Returns e raised to the power of the given number. | | FACT | Returns the factorial of a number. | | FIND | Returns the position of a string within another string, which is case sensitive.| @@ -182,7 +201,7 @@ The following are the list of formulas supported in spreadsheet, | HLOOKUP | Looks for a value in the top row of the array of values and then returns a value in the same column from a row in the array that you specify. | | HOUR | Returns the number of hours in a specified time string. | | IF | Returns value based on the given expression. | -| IFERROR | Returns value if no error found else it will return specified value. | +| IFERROR | Returns a value when no error is found; otherwise, returns the specified value. | | IFS | Returns value based on the given multiple expressions. | | INDEX | Returns a value of the cell in a given range based on row and column number. | | INT | Rounds a number down to the nearest integer. | @@ -198,8 +217,8 @@ The following are the list of formulas supported in spreadsheet, | MEDIAN | Returns the median of the given set of numbers. | | MINUTE | Returns the number of minutes in a specified time string. | | MIN | Returns the smallest number of the given arguments. | -| MOD | Returns a remainder after a number is divided by divisor. | -| MONTH | Returns the number of months in a specified date string. | +| MOD | Returns the remainder after a number is divided by the divisor. | +| MONTH | Returns the month number from a specified date as an integer from 1 to 12. | | NOT | Returns the inverse of a given logical expression. | | NOW | Returns the current date and time. | | ODD | Rounds a positive number up and negative number down to the nearest odd integer. | @@ -223,28 +242,28 @@ The following are the list of formulas supported in spreadsheet, | SUM | Adds a series of numbers and/or cells. | | SUMIF | Adds the cells based on specified condition. | | SUMIFS | Adds the cells based on specified conditions. | -| SUMPRODUCT | Returns the sum of the products of the corresponding array in given arrays. | +| SUMPRODUCT | Returns the sum of the products of corresponding values in the given arrays. | | T | Checks whether a value is text or not and returns the text. | | TEXT | Converts the supplied value into text by using the user-specified format. | -| TIME | Converts hours, minutes, seconds to the time formatted text. | +| TIME | Converts the specified hours, minutes, and seconds to a time value. | | TODAY | Returns the current date. | | TRUNC | Truncates a supplied number to a specified number of decimal places. | -| UNIQUE | Returns a unique values from a range or array. | +| UNIQUE | Returns unique values from a range or array. | | VLOOKUP | Looks for a specific value in the first column of a lookup range and returns a corresponding value from a different column within the same row. | ## Formula Error Dialog -If you enter an invalid formula in a cell, an error dialog with an error message will appear. For instance, a formula with the incorrect number of arguments, a formula without parenthesis, etc. +If an invalid formula is entered in a cell, an error dialog displays the corresponding error message. For example, an error occurs when a formula contains an incorrect number of arguments or missing parentheses. | Error Message | Reason | |-------|---------| -| We found that you typed a formula with an invalid arguments | Occurs when passing an argument even though it wasn't needed. | +| We found that you typed a formula with invalid arguments | Occurs when passing an argument even though it wasn't needed. | | We found that you typed a formula with an empty expression | Occurs when passing an empty expression in the argument. | -| We found that you typed a formula with one or more missing opening or closing parenthesis | Occurs when an open parenthesis or a close parenthesis is missing. | +| We found that you typed a formula with one or more missing opening or closing parentheses | Occurs when an open parenthesis or a close parenthesis is missing. | | We found that you typed a formula which is improper | Occurs when passing a single reference but a range was needed. | | We found that you typed a formula with a wrong number of arguments | Occurs when the required arguments were not passed. | | We found that you typed a formula which requires 3 arguments | Occurs when the required 3 arguments were not passed. | -| We found that you typed a formula with a mismatched quotes | Occurs when passing an argument with mismatched quotes. | +| We found that you typed a formula with mismatched quotes | Occurs when passing an argument with mismatched quotes. | | We found that you typed a formula with a circular reference | Occurs when passing a formula with circular cell reference. | | We found that you typed a formula which is invalid | Except in the cases mentioned above, all other errors will fall into this broad category. | diff --git a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/freeze-pane.md b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/freeze-pane.md index 3d753cc451..9d966b0339 100644 --- a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/freeze-pane.md +++ b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/freeze-pane.md @@ -8,42 +8,35 @@ documentation: ug --- -# FreezePanes in ASP.NET Core Spreadsheet control +# Freeze Panes in ASP.NET Core Spreadsheet control -Freeze Panes helps you to keep particular rows or columns visible when scrolling the sheet content in the spreadsheet. You can specify the number of frozen rows and columns using the `frozenRows` and `frozenColumns` properties inside the [`Sheet`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_Sheets) property. +The Freeze Panes feature helps keep specific rows or columns visible while scrolling through the worksheet. Use the `frozenRows` and `frozenColumns` properties within the [`Sheet`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_Sheets) model to specify the number of rows and columns to freeze. -## Apply freeze panes on UI +## Apply freeze panes through the UI -**User Interface**: +To apply freeze panes: -In the active spreadsheet, click the cell where you want to create freeze panes. Freeze panes can be done in any of the following ways: +* Select the cell below the rows and to the right of the columns that you want to freeze. +* Open the **View** tab in the Ribbon. +* Select **Freeze Panes**. -* Select the View tab in the Ribbon toolbar and choose the `Freeze Panes` item. -* Use the `freezePanes` method programmatically. +You can also use the `freezePanes` method to apply freeze panes programmatically. -## FrozenRows +## Frozen Rows -It allows you to keep a certain number of rows visible while scrolling vertically through the rest of the worksheet. +Frozen rows remain visible while scrolling vertically through the rest of the worksheet. You can freeze rows in one of the following ways: -**User Interface**: +* Select a cell in the active worksheet, open the **View** tab in the Ribbon, and choose **Freeze Rows**. +* Set the `frozenRows` property in the `Sheet` model to specify the number of rows to freeze. -In the active spreadsheet, select the cell where you want to create frozen rows. Frozen rows can be done in any one of the following ways: +## Frozen Columns -* Select the View tab in the Ribbon toolbar and choose the `Freeze Rows` item. -* You can specify the number of frozen rows using the `frozenRows` property inside the `Sheet` property. +Frozen columns remain visible while scrolling horizontally through the rest of the worksheet. You can freeze columns in one of the following ways: -## FrozenColumns +* Select a cell in the active worksheet, open the **View** tab in the Ribbon, and choose **Freeze Columns**. +* Set the `frozenColumns` property in the `Sheet` model to specify the number of columns to freeze. -It allows you to keep a certain number of columns visible while scrolling horizontally through the rest of the worksheet. - -**User Interface**: - -In the active spreadsheet, select the cell where you want to create frozen columns. Frozen columns can be done in any one of the following ways: - -* Select the View tab in the Ribbon toolbar and choose the `Freeze Columns` item. -* You can specify the number of frozen columns using the `frozenColumns` property inside the `Sheet` property. - -In this demo, the frozenColumns is set as ‘2’, and the frozenRows is set as ‘2’. Hence, the two columns on the left and the top two rows are frozen. +In this example, the `frozenColumns` and `frozenRows` properties are both set to `2`. Therefore, the first two columns on the left and the first two rows at the top remain frozen while scrolling. {% tabs %} {% highlight cshtml tabtitle="CSHTML" %} @@ -54,14 +47,18 @@ In this demo, the frozenColumns is set as ‘2’, and the frozenRows is set as {% endhighlight %} {% endtabs %} +After running the sample, scroll vertically and horizontally to verify that the first two rows and the first two columns remain visible. + +## Remove freeze panes +To remove the frozen rows and columns, open the **View** tab in the Ribbon and choose **Unfreeze Panes**. ## Limitations Freeze Panes feature is not compatible with all the features which are available in the spreadsheet. Below features are not compatible with Freeze Panes feature. -* Merging the cells between freeze and unfreeze area. -* If images and charts are added inside the freeze area cells, their portion in the unfreeze area will not move when scrolling. +* Cells cannot be merged across the boundary between the frozen and unfrozen areas. +* When images or charts extend from the frozen area into the unfrozen area, the portion in the unfrozen area does not move while scrolling. ## See Also diff --git a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/global-local.md b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/global-local.md index 96e2d1f3c0..5a8ca26aed 100644 --- a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/global-local.md +++ b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/global-local.md @@ -11,9 +11,9 @@ documentation: ug ## Localization -The [Localization](https://ej2.syncfusion.com/aspnetcore/documentation/common/localization) library allows you to localize the default text content of the Spreadsheet. The Spreadsheet has static text on some features (cell formatting, Merge, Data validation, etc.) that can be changed to other cultures (Arabic, Deutsch, French, etc.) by defining the [locale](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_Locale) value and translation object. +The [Localization](https://ej2.syncfusion.com/aspnetcore/documentation/common/localization) library allows you to localize the default text displayed by the Spreadsheet. Static text used by features such as cell formatting, merge cells, and data validation can be translated by defining the [locale](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_Locale) property and loading the corresponding translation object. -The following list of properties and their values are used in the Spreadsheet. +The following table lists the locale keywords and their corresponding default text used in the Spreadsheet. |Locale keywords|Text| |---------------|----| @@ -111,7 +111,7 @@ PRODUCT | Multiplies a series of numbers and/or cells. AVERAGE | Calculates average for the series of numbers and/or cells excluding text. AVERAGEIF | Calculates average for the cells based on the specified criterion. AVERAGEIFS | Calculates average for the cells based on the specified conditions. -AVERAGEA | Calculates the average for the cells evaluating TRUE as 1 text and FALSE as 0. +AVERAGEA | Calculates the average for the cells, evaluating TRUE as 1 and text and FALSE as 0. COUNT | Counts the cells that contain numeric values in a range. COUNTIF | Counts the cells based on the specified condition. COUNTIFS | Counts the cells based on specified conditions. @@ -123,19 +123,19 @@ DAY | Returns the day from the given date. DAYS | Returns the number of days between two dates. IF | Returns value based on the given expression. IFS | Returns value based on the given multiple expressions. -AND | Returns TRUE if all the arguments are TRUE otherwise returns FALSE. -OR | Returns TRUE if any of the arguments are TRUE otherwise returns FALSE. -IFERROR | Returns value if no error found else it will return specified value. +AND | Returns TRUE if all the arguments are TRUE; otherwise, returns FALSE. +OR | Returns TRUE if any of the arguments are TRUE; otherwise, returns FALSE. +IFERROR | Returns a value when no error is found; otherwise, returns the specified value. CHOOSE | Returns a value from the list of values based on the index number. INDEX | Returns the value of the cell in a given range based on row and column number. -FIND | Returns the position of a string within another string which is case sensitive. +FIND | Returns the position of a string within another string, which is case-sensitive. CONCATENATE | Combines two or more strings together. CONCAT | Concatenates a list or a range of text strings. SUBTOTAL | Returns subtotal for a range using the given function number. RADIANS | Converts degrees into radians. MATCH | Returns the relative position of a specified value in the given range. -DefineNameExists | This name already exists try a different name. -CircularReference | When a formula refers to one or more circular references this may result in an incorrect calculation. +DefineNameExists | This name already exists. Try a different name. +CircularReference | When a formula refers to one or more circular references, this may result in an incorrect calculation. ShowRowsWhere | Show rows where | CustomFilterDatePlaceHolder | Choose a date CustomFilterPlaceHolder | Enter the value @@ -189,7 +189,7 @@ UnprotectSheet | Unprotect Sheet SelectCells | Select cells FormatCells | Format cells FormatRows | Format rows -Format Columns | Format columns +FormatColumns | Format columns InsertLinks | Insert links ProtectContent | Protect the contents of locked cells ProtectAllowUser | Allow all users of this worksheet to | @@ -238,7 +238,7 @@ EqualTo | Equal to NotEqualTo | Not equal to Greaterthan | Greater than Lessthan | Less than -GreaterThanOrEqaulTo | Greater than or eqaul to +GreaterThanOrEqualTo | Greater than or equal to LessThanOrEqualTo | Less than or equal to InCellDropDown | In-cell-dropdown Sources | Sources @@ -376,9 +376,16 @@ IsProtected | is protected ### Loading translations -To load translation object in an application, use `load` function of the `L10n` class. +To load a translation object in an application, use the `load` function of the `L10n` class. -The following example demonstrates the Spreadsheet in `French` culture. In the below sample we have translated the ribbon tab names and Home tab content (clipboard, cell style). +To load translations in the Spreadsheet: + +1. Create or reference the locale translation object. +2. Load the translation object using the `L10n.load()` method. +3. Set the Spreadsheet `locale` property to the corresponding culture code. +4. Render the Spreadsheet. + +The following example demonstrates the Spreadsheet in the French culture. The Ribbon tab names and Home tab content, including clipboard and cell-style options, are localized. {% tabs %} {% highlight cshtml tabtitle="CSHTML" %} @@ -389,13 +396,15 @@ The following example demonstrates the Spreadsheet in `French` culture. In the b {% endhighlight %} {% endtabs %} - +After running the sample, verify that the translated Ribbon tabs and Home tab content are displayed in French. ## Internationalization -The Internationalization library is used to globalize number, date, and time values in the spreadsheet component. +The Internationalization library globalizes number, date, time, and currency values in the Spreadsheet. -The following example demonstrates the Spreadsheet in French [ `fr-CH`] culture. In the below sample we have globalized the Date(Date column), Time(Time column), and Currency(Amount column) formats. +Before rendering the Spreadsheet, ensure that the required culture data is loaded and that the Spreadsheet is configured with the corresponding culture. + +The following example demonstrates the Spreadsheet using the French (`fr-CH`) culture. It globalizes the date values in the **Date** column, time values in the **Time** column, and currency values in the **Amount** column. {% tabs %} {% highlight cshtml tabtitle="CSHTML" %} @@ -406,11 +415,11 @@ The following example demonstrates the Spreadsheet in French [ `fr-CH`] culture. {% endhighlight %} {% endtabs %} - +After running the sample, verify that the date, time, and currency values are displayed according to the `fr-CH` culture. ## Right to left (RTL) -RTL provides an option to switch the text direction and layout of the Spreadsheet component from right to left. It improves the user experiences and accessibility for users who use right-to-left languages (Arabic, Farsi, Urdu, etc.). To enable RTL Spreadsheet, set the [`enableRtl`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_EnableRtl) to true. +RTL support changes the text direction and layout of the Spreadsheet from right to left. It improves usability and accessibility for users of right-to-left languages, such as Arabic, Farsi, and Urdu. set the [`enableRtl`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_EnableRtl) property to true to enable the right-to-left layout. {% tabs %} {% highlight cshtml tabtitle="CSHTML" %} @@ -421,7 +430,7 @@ RTL provides an option to switch the text direction and layout of the Spreadshee {% endhighlight %} {% endtabs %} - +After running the sample, verify that the Spreadsheet layout, Ribbon, and worksheet content are displayed from right to left. ## See Also diff --git a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/how-to/change-active-sheet.md b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/how-to/change-active-sheet.md index cffe810c36..7492fb1283 100644 --- a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/how-to/change-active-sheet.md +++ b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/how-to/change-active-sheet.md @@ -9,9 +9,16 @@ documentation: ug # Changing the active sheet in ASP.NET Core Spreadsheet control -You can change the active sheet of imported file by updating [`activeSheetIndex`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_ActiveSheetIndex) property on the [`openComplete`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_OpenComplete) event. +You can change the active sheet of the imported file by updating the [`activeSheetIndex`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_ActiveSheetIndex) property in the [`openComplete`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_OpenComplete) event. -The following code example shows how to set the active sheet when importing an Excel file. +To change the active sheet after importing an Excel file: + +1. Bind the `openComplete` event to the Spreadsheet. +2. In the event handler, set the `activeSheetIndex` property to the index of the sheet you want to activate. +3. Open an Excel file in the Spreadsheet. +4. After the file is loaded, the Spreadsheet displays the sheet specified by the `activeSheetIndex` property. + +The following code example demonstrates how to change the active sheet after importing an Excel file. {% tabs %} {% highlight cshtml tabtitle="CSHTML" %} diff --git a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/how-to/create-a-object-structure.md b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/how-to/create-a-object-structure.md index a5256c6ed4..7c9e46c6ae 100644 --- a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/how-to/create-a-object-structure.md +++ b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/how-to/create-a-object-structure.md @@ -9,17 +9,19 @@ documentation: ug # Create an object structure in ASP.NET Core Spreadsheet Control -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. +This topic explains how to construct a JSON object that can be passed to the `openFromJson` method to render the Spreadsheet. The JSON object contains a `Workbook` key whose value defines the Spreadsheet properties. ```js -{ Workbook: {} } +{ + Workbook: {} +} ``` -The following properties are the root level properties of the `Workbook` object. +The following table lists the root-level properties of the `Workbook` object. | Property | Type | Description | |-------|-------|-------| -| activeSheetIndex | number | Specifies active sheet index in the workbook. | +| activeSheetIndex | number | Specifies the active sheet index in the workbook. | | sheets | `Sheet[]` | Contains a list of sheet properties. | | definedNames | `DefineName[]` | Specifies the name for a range and uses it in the formula for calculation. | @@ -30,13 +32,13 @@ The following table defines each property of the `Sheet`. | name | string | Specifies the name of the sheet. | | selectedRange | string | Specifies selected range in the sheet. | | activeCell | string | Specifies active cell within `selectedRange` in the sheet. | -| topLeftCell | string | Specified cell will be positioned at the upper-left corner of the sheet. | +| topLeftCell | string | Specifies the cell positioned at the upper-left corner of the sheet. | | showHeaders | boolean | Specifies to show or hide column and row headers in the sheet. | | showGridLines | boolean | Specifies to show or hide gridlines in the sheet. | | isProtected | boolean | Specifies to protect the cells in the sheet. | | state | [`SheetState`](../worksheet#sheet-visibility) | Specifies the sheet visibility state. There must be at least one visible sheet in Spreadsheet. | -| columns | `Column[]` | Contains a list of column properties | -| rows | `Row[]` | Contains a list of row properties | +| columns | `Column[]` | Contains a list of column properties. | +| rows | `Row[]` | Contains a list of row properties. | | protectSettings | [`ProtectSettings`](../protect-sheet#protect-sheet) | Configures protect and its options. | | conditionalFormats | `ConditionalFormat[]` | Specifies the conditional formatting for the sheet. | @@ -65,13 +67,13 @@ The following table defines each property of the `Cell`. | formula | string | Defines the formula or expression of the cell. | | format | string | Specifies the number format code to display the value in specified number format. | | hyperlink | string | Specifies the hyperlink of the cell. | -| wrap | boolean | Wraps the cell text to the next line, if the text width exceeds the column width. | -| isLocked | boolean | Specifies the cell whether it is locked or not, for allowing edit range in the spreadsheet protect option. | +| wrap | boolean | Wraps the cell text to the next line when its width exceeds the column width. | +| isLocked | boolean | Specifies whether the cell is locked when worksheet protection is enabled. | | colSpan | number | Specifies the column-wise cell merge count. | | rowSpan | number | Specifies the row-wise cell merge count. | | style | `CellStyle` | Specifies the cell style options. | | validation | `Validation` | Specifies the validation of the cell. | -| image | `Image[]` | Specifies the image of the cell. | +| image | `Image[]` | Specifies the images associated with the cell. | The following table defines each property of the `CellStyle`. @@ -93,6 +95,8 @@ The following table defines each property of the `CellStyle`. | borderLeft | string | Specifies left border of the cell. | | borderRight | string | Specifies right border of the cell. | +### Cell style type definitions + ```js 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'; type VerticalAlign = 'bottom' | 'middle' | 'top'; @@ -106,14 +110,15 @@ The following table defines each property of the `Validation`. | Property | Type | Description | |-------|-------|-------| -| type | `ValidationType` | Specifies Validation Type. | -| operator | `ValidationOperator` | Specifies Validation Operator. | -| value1 | string | Specifies Validation Minimum Value. | -| value2 | string | Specifies Validation Maximum Value. | -| ignoreBlank | boolean | Specifies IgnoreBlank option in Data Validation. | -| inCellDropDown | boolean | Specifies InCellDropDown option in Data Validation. | -| isHighlighted | boolean | Specifies to allow Highlight Invalid Data. | -| | | | +| type | `ValidationType` | Specifies the validation type. | +| operator | `ValidationOperator` | Specifies the validation operator. | +| value1 | string | Specifies the minimum validation value. | +| value2 | string | Specifies the maximum validation value. | +| ignoreBlank | boolean | Specifies whether blank cells are ignored. | +| inCellDropDown | boolean | Specifies whether the in-cell drop-down is displayed. | +| isHighlighted | boolean | Specifies whether invalid data is highlighted. | + +### Validation type definitions ```js type ValidationType = 'WholeNumber' | 'Decimal' | 'Date' | 'TextLength' | 'List' | 'Time'; @@ -135,11 +140,15 @@ The following table defines each property of the `ConditionalFormat`. | Property | Type | Description | |-------|-------|-------| -| type | `HighlightCell` or `TopBottom` or `DataBar` or `ColorScale` or `IconSet` | Specifies Conditional formatting Type. | -| format | `Format` | Specifies format. | -| cFColor | `CFColor` | Specifies Conditional formatting Highlight Color. | -| value | string | Specifies Conditional formatting value. | -| range | string | Specifies Conditional formatting range. | +| type | `HighlightCell` or `TopBottom` or `DataBar` or `ColorScale` or `IconSet` | Specifies the conditional-formatting type. | +| format | `Format` | Specifies the formatting applied when the condition is met. | +| cFColor | `CFColor` | Specifies the conditional-formatting highlight color. | +| value | string | Specifies the conditional-formatting value. | +| range | string | Specifies the range to which conditional formatting is applied. | + +The `HighlightCell`, `TopBottom`, `DataBar`, `ColorScale`, and `IconSet` types are defined in the following type definitions. + +### Conditional-formatting type definitions ```js type HighlightCell = 'GreaterThan' | 'LessThan' | 'Between' | 'EqualTo' | 'ContainsText' | 'DateOccur' | 'Duplicate' | 'Unique'; @@ -166,7 +175,9 @@ The following table defines each property of the `DefinedName`. | comment | string | Specifies comment for the defined name. | | refersTo | string | Specifies reference for the defined name. | -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. +Obtain the rendered Spreadsheet instance in the `created` event handler before calling the `openFromJson()` method. Bind the `created` event when rendering the Spreadsheet. + +The following example passes the constructed JSON object to the `openFromJson()` method in the [`created`](https://help.syncfusion.com/cr/aspnetmvc-js2/syncfusion.ej2.spreadsheet.spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_Created) event handler to render the Spreadsheet. {% tabs %} {% highlight cshtml tabtitle="CSHTML" %} diff --git a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/how-to/identify-the-context-menu-opened.md b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/how-to/identify-the-context-menu-opened.md index 76fe42f42b..2cf482b4c4 100644 --- a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/how-to/identify-the-context-menu-opened.md +++ b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/how-to/identify-the-context-menu-opened.md @@ -9,9 +9,20 @@ documentation: ug # Identify the context menu opened in ASP.NET Core Spreadsheet control -The Spreadsheet includes several context menus that will open and display depending on the action. When you right-click on a cell, for example, a context menu with options related to the cell element appears. +The Spreadsheet includes several context menus that open depending on the action performed. For example, when you right-click a cell, a context menu displays options related to that cell. -The class name returned by the [contextMenuBeforeOpen](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_ContextMenuBeforeOpen) event can be used to identify the context menu that is opened. The context menus and their class names are tabulated below. +Use the class name available in the [contextMenuBeforeOpen](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_ContextMenuBeforeOpen) event arguments to identify which context menu is opening. + +To identify which context menu is opening: + +1. Bind the `contextMenuBeforeOpen` event to the Spreadsheet. +2. In the event handler, obtain the class name from the event arguments. +3. Compare the class name with the CSS selectors listed in the following table. +4. Perform the required operation based on the identified context menu. + +## Context menu selectors + +The following table lists the CSS selectors associated with each context menu: | Class name | Context menu name | |-------|---------| @@ -20,7 +31,9 @@ The class name returned by the [contextMenuBeforeOpen](https://help.syncfusion.c | .e-rowhdr-table | Row header context menu | | .e-colhdr-table | Column header context menu | -The following code example shows how to identify the context menu opened. +## Example + +The following code example demonstrates how to identify which context menu is opening. {% tabs %} {% highlight cshtml tabtitle="CSHTML" %} diff --git a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/illustrations.md b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/illustrations.md index 0b5b716be7..e0346bda1b 100644 --- a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/illustrations.md +++ b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/illustrations.md @@ -20,10 +20,10 @@ N> * The default value for [`allowImage`](https://help.syncfusion.com/cr/aspnetc ### Insert Image -You can insert the image by using one of the following ways, +You can insert an image in one of the following ways: -* Selecting the Insert tab in the Ribbon toolbar, and then choose the Image tab. -* Use the `insertImage()` method programmatically. +* Open the **Insert** tab in the Ribbon, choose **Image**, and select the image to insert. +* Use the `insertImage()` method to insert an image programmatically. The available parameters in `insertImage()` method are, @@ -38,15 +38,15 @@ The available arguments in `ImageModel` are: * id: Specifies image element id. * height: Specifies the height of the image. * width: Specifies the width of the image. -* top: Specifies the height of the image. -* left: Specifies the width of the image. +* Open the **Insert** tab in the Ribbon, choose **Image**, and select the image to insert. +* Use the `insertImage()` method to insert an image programmatically. -N> * In spreadsheet, you can add many types of image files, including IMAGE, JPG, PNG, GIF and JPEG files. +N> * The Spreadsheet supports image formats such as JPG, JPEG, PNG, and GIF. ### Delete Image -* If you want to delete the image, just select the image firstly, and then press the Delete key. -* Use the `deleteImage()` method programmatically. +* Select the image and press the `Delete` key. +* Use the `deleteImage()` method to delete the image programmatically. The available parameters in `deleteImage()` method are, @@ -57,17 +57,17 @@ The available parameters in `deleteImage()` method are, ### Image Customization -Image feature allows you to view and insert a image in a spreadsheet and you can change the height and width of the image by resizing and move it to another position. +The Image feature allows you to insert, resize, and reposition an image in the Spreadsheet. #### Height and Width -* You can change the height and width of the image by resizing. -* Use the `height` and `width` property in the `insertImage()` method programmatically. +* Resize the image to change its height and width. +* Use the `height` and `width` properties with the `insertImage()` method to configure the image dimensions programmatically. #### Top and Left -* You can change the position of the image by drag and drop. -* Use the `top` and `left` property in the `insertImage()` method programmatically. +* Drag and drop the image to change its position. +* Use the `top` and `left` properties with the `insertImage()` method to configure the image position programmatically. {% tabs %} {% highlight cshtml tabtitle="CSHTML" %} @@ -78,18 +78,18 @@ Image feature allows you to view and insert a image in a spreadsheet and you can {% endhighlight %} {% endtabs %} - +After running the sample, verify that the image is inserted at the specified position with the configured height and width. ### Limitations of Image -The following features have some limitations in Image: +The Image feature has the following limitations: -* Corner resizing option in the image element. -* Copy and paste the external image. +* Images cannot be resized using the corner handles. +* Copying and pasting images from external sources has limited support. ## Chart -A chart is a graphical representation of data, that organizes and represents a set of numerical or qualitative data. It mostly displays the selected range of data in terms of `x`-axis and `y`-axis. You can use the [`allowChart`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_AllowChart) property to enable or disable the chart functionality. +A chart provides a graphical representation of numerical or qualitative data. It displays the selected data range using the x-axis and y-axis. Use the [`allowChart`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_AllowChart) property to enable or disable chart functionality. N> * The default value for the [`allowChart`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_AllowChart) property is `true`. @@ -106,10 +106,10 @@ N>* Column Chart ### Insert Chart -You can insert the chart by using one of the following ways, +You can insert a chart in one of the following ways: -* Select the chart icon in the Ribbon toolbar under the Insert Tab. -* Use the `insertChart()`method programmatically. +* Select the data range, open the **Insert** tab in the Ribbon, and choose the required chart type. +* Use the `insertChart()` method to insert a chart programmatically. The available parameter in the `insertChart()` method is, @@ -135,10 +135,14 @@ The available arguments in the `ChartModel` are: {% endhighlight %} {% endtabs %} +After running the sample, verify that the chart displays the values from the selected data range. + ### Delete Chart -* If you want to delete the chart, just select the chart, and then press the Delete key. -* Use the `deleteChart()`method programmatically. +You can delete a chart in one of the following ways: + +* Select the chart and press the `Delete` key. +* Use the `deleteChart()` method to delete the chart programmatically. The available parameter in the `deleteChart()` method is, @@ -148,11 +152,10 @@ The available parameter in the `deleteChart()` method is, ### Chart Customization -Chart feature allows you to view and insert a chart in a spreadsheet, and you can change the height and width of the chart by resizing and moving it to another position. +The Chart feature allows you to insert, resize, and reposition a chart in the Spreadsheet. -* You can change the height and width of the chart by resizing. - -* You can change the position of the chart by drag and drop. +* Resize the chart to change its height and width. +* Drag and drop the chart to change its position. {% tabs %} {% highlight cshtml tabtitle="CSHTML" %} @@ -165,7 +168,9 @@ Chart feature allows you to view and insert a chart in a spreadsheet, and you ca #### Customization of line chart markers -Using the [`actionBegin`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_ActionBegin) event, you can change the shape, size, fill color, and border of the line chart marker. In the following example, you can see the modified marker appearance, such as shape and size, while creating the line chart with UI interaction. +Using the [`actionBegin`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_ActionBegin) event to customize the shape, size, fill color, and border of line chart markers. In the event handler, identify the chart-creation action and update the corresponding marker settings before the chart is rendered. + +The following example demonstrates how to customize the shape and size of markers while creating a line chart through the UI. {% tabs %} {% highlight cshtml tabtitle="CSHTML" %} @@ -176,13 +181,15 @@ Using the [`actionBegin`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusi {% endhighlight %} {% endtabs %} +After running the sample, create a line chart and verify that the configured marker shape and size are applied. + ### Limitations of Chart -The following features have some limitations in the Chart: +The Chart feature has the following limitations: -* Insert row/delete row between the chart data source will not reflect the chart. -* Copy/paste into the chart data source will not reflect the chart. -* Corner resizing option in chart element. +* Inserting or deleting rows within the chart data source does not automatically update the chart. +* Copying and pasting values into the chart data source does not automatically update the chart. +* Charts cannot be resized using the corner handles. ## See Also diff --git a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/keyboard-shortcuts.md b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/keyboard-shortcuts.md index fcfe48d523..f154950dd2 100644 --- a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/keyboard-shortcuts.md +++ b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/keyboard-shortcuts.md @@ -8,113 +8,148 @@ documentation: ug --- -# Keyboard Shortcuts And Navigation in ASP.NET Core Spreadsheet Control +# Keyboard Shortcuts and Navigation in ASP.NET Core Spreadsheet Control -The keyboard shortcuts supported in the Spreadsheet are, +The following keyboard shortcuts are supported in the Spreadsheet: + +> Keyboard shortcut behavior can vary depending on the operating system and browser. On macOS, some `Ctrl` shortcuts may use the `Command` key. Browser-reserved shortcuts may override the corresponding Spreadsheet shortcuts. + +## File operations | Shortcut | Description | -|-------|---------| -| Ctrl + O | Displays dialog to open a file. | +|----------|-------------| +| Ctrl + O | Displays a dialog to open a file. | | Ctrl + S / Alt + F2 | Saves the workbook. | -| Ctrl + P | Print the active worksheet when the spreadsheet is in focus. | -| F2 | Enables edit mode. | -| ESC | Cancel edit mode and discard the changes. | -| Backspace and SPACE | Clears content of the active cell and enables edit mode. | +| Ctrl + P | Prints the active worksheet when the Spreadsheet is in focus. | +| Ctrl + Alt + N | Opens a new workbook. | +| Shift + F11 | Adds a new worksheet. | + +## Clipboard and general operations + +| Shortcut | Description | +|----------|-------------| | Ctrl + C | Copies the selected cells. | | Ctrl + X | Cuts the selected cells. | -| Ctrl + V | Paste the clipboard(cut or copied) content in the new selected range. | -| Ctrl + B | Applies or removes **bold** formatting. | -| Ctrl + I | Applies or removes *italic* formatting. | -| Ctrl + U | Applies or removes `underline`. | -| Ctrl + 5 | Applies or removes ~~strikethrough~~. | -| Ctrl + Z | Reverses (Undo) the last action. | -| Ctrl + Y | Repeats (Redo) the last reversed action. | -| Ctrl + K | It opens the `Insert Hyperlink` dialog for adding new hyperlink to a cell. If the selected cell already contains hyperlink, it opens the `Edit Hyperlink` dialog. | -| Ctrl + F / Shift + F5 | Opens `Find` dialog. | -| Ctrl + H | Opens `Find and Replace` dialog. | -| Ctrl + G | Opens `GoTo` dialog, which helps to navigate to cell. | -| Ctrl + Shift + L | Applies filter to the first row of the selected range or used range. | -| Alt + F | Opens the `File` menu. | -| Alt + H | Go to `Home` tab. | -| Alt + N | Go to `Insert` tab. | -| Alt + M | Go to `Formulas` tab. | -| Alt + A | Go to `Data` tab. | -| Alt + W | Go to `View` tab. | -| Tab | Navigate the active cell to the next cell in the same row. | -| Shift + Tab | Navigate the active cell to the previous cell in the same row. | -| Right or Left arrow| Move the focus to next or previous item in the tab if the focus is on ribbon tab.| -| Up arrow | When a menu is open, move focus to the next item. | -| Down arrow | When a menu is open, move focus to the previous item. | -| Spacebar or Enter | Activate a selected button. | -| Ctrl + F8 | Expand or collapse the ribbon content. | -| Ctrl + Shift + U | Expand or collapse the formula bar. | -| Ctrl + 9 | Hide the selected row. | -| Ctrl + 0 | Hide the selected column. | -| Home | Moves the selection to starting column in worksheet. | -| Ctrl + Home | Move the selection to the first visible cell on a worksheet. | -| Ctrl + Shift + Home | Extend the selection of cells to the beginning of the worksheet. | -| Ctrl + End | Move to the last cell on a worksheet, right most last column and last row cell. | -| Ctrl + & | Apply an outline border to the selected cells. | +| Ctrl + V | Pastes the clipboard content into the selected range. | +| Ctrl + Z | Reverses the last action. | +| Ctrl + Y | Repeats the last reversed action. | +| Ctrl + K | Opens the **Insert Hyperlink** dialog to add a new hyperlink to a cell. If the selected cell already contains a hyperlink, opens the **Edit Hyperlink** dialog. | +| Ctrl + F / Shift + F5 | Opens the **Find** dialog. | +| Ctrl + H | Opens the **Find and Replace** dialog. | +| Ctrl + G | Opens the **Go To** dialog to navigate to a cell. | +| Ctrl + Shift + L | Applies a filter to the first row of the selected range or used range. | +| Shift + F10 | Opens the context menu. | +| Shift + F3 | Opens the **Insert Function** dialog. | +| Ctrl + Shift + F2 | Opens the comment editor for the active cell. Press `Esc` to close the comment editor. | +| Shift + F2 | Opens the dialog to add or edit a note. Press `Esc` while the dialog is focused to save the note and close the dialog. | + +## Cell editing + +| Shortcut | Description | +|----------|-------------| +| F2 | Enables edit mode. | +| Esc | Cancels edit mode and discards the changes. | +| Backspace or Space | Clears the active cell content and enters edit mode. | +| Delete | Removes the contents of the active cell. | +| Alt + Enter | Adds a new line while editing a cell. | +| Enter | Completes cell editing and selects the cell below in the same column. | +| Shift + Enter | Completes cell editing and selects the cell above in the same column. | +| Tab | Completes cell editing and selects the next cell in the same row. | +| Shift + Tab | Completes cell editing and selects the previous cell in the same row. | + +## Cell navigation + +| Shortcut | Description | +|----------|-------------| +| Up arrow | Navigates from the active cell to the previous cell in the same column. | +| Down arrow | Navigates from the active cell to the next cell in the same column. | +| Left arrow | Navigates from the active cell to the previous cell in the same row. | +| Right arrow | Navigates from the active cell to the next cell in the same row. | +| Tab | Navigates from the active cell to the next cell in the same row. | +| Shift + Tab | Navigates from the active cell to the previous cell in the same row. | +| Enter | Navigates from the active cell to the next cell in the same column. | +| Shift + Enter | Navigates from the active cell to the previous cell in the same column. | +| Home | Moves the selection to the first column in the worksheet. | +| Ctrl + Home | Moves the selection to the first visible cell in the worksheet. | +| Ctrl + Shift + Home | Extends the selection to the beginning of the worksheet. | +| Ctrl + End | Moves the selection to the last used cell in the worksheet. | +| Page Up | Moves one page up. | +| Page Down | Moves one page down. | +| Shift + Page Up | Extends the selection upward by one page. | +| Shift + Page Down | Extends the selection downward by one page. | +| Ctrl + Left | Navigates to the previous non-blank cell in the same row. | +| Ctrl + Right | Navigates to the last non-blank cell in the same row. | +| Ctrl + Up | Navigates to the first non-blank cell in the same column. | +| Ctrl + Down | Navigates to the last non-blank cell in the same column. | +| Ctrl + Shift + Left | Extends the selection to the previous non-blank cell in the same row. | +| Ctrl + Shift + Right | Extends the selection to the last non-blank cell in the same row. | +| Ctrl + Shift + Up | Extends the selection to the first non-blank cell in the same column. | +| Ctrl + Shift + Down | Extends the selection to the last non-blank cell in the same column. | +| Shift + Up | Extends the selection to the previous row. | +| Shift + Down | Extends the selection to the next row. | +| Shift + Left | Extends the selection to the previous column. | +| Shift + Right | Extends the selection to the next column. | +| Shift + Home | Extends the selection to the first column in the worksheet. | +| Ctrl + Spacebar | Selects the entire column. | +| Shift + Spacebar | Selects the entire row. | +| Ctrl + D | Fills the selected cells downward. | +| Ctrl + R | Fills the selected cells to the right. | + +## Formatting + +| Shortcut | Description | +|----------|-------------| +| Ctrl + B | Applies or removes bold formatting. | +| Ctrl + I | Applies or removes italic formatting. | +| Ctrl + U | Applies or removes underline formatting. | +| Ctrl + 5 | Applies or removes strikethrough formatting. | +| Ctrl + & | Applies an outline border to the selected cells. | | Ctrl + Shift + & | Apply an outline border to the cells that you've chosen. | -| Ctrl + Shift + ~ | Apply the `General` number format. | -| Ctrl + Shift + $ | Apply the `Currency` format with two decimal places (negative numbers in parentheses). | -| Shift + F10 | Open the context menu. | -| Ctrl + % | Apply the `Percentage` format with no decimal places. | -| Ctrl + ^ | Apply the `Scientific` number format with two decimal places. | -| Ctrl + Shift + # |Apply the `Date` format with the day, month, and year. | -| Ctrl + Shift + @ | Apply the `Time` format with the hour and minute, and AM or PM. | -| Ctrl + Shift + ! | Apply the `Number` format with two decimal places, thousands separator, and minus sign (-) for negative values. | -| Ctrl + Spacebar | Select an entire column in a worksheet. | -| Shift + Spacebar | Select an entire row in a worksheet. | -| Shift + F3 | Opens `Insert Function` dialog. | -| Ctrl + Alt + N | Opens new workbook. | -| Shift + Page Down | Perform page down by selecting all cells between. | -| Shift + Page Up | Perform page up by selecting all cells between. | -| Ctrl + Left | Navigate to the non-blank cell before the active cell in the same row. | -| Ctrl + Right | Navigate to the last non-blank cell in the same row as the active cell. | -| Ctrl + Up | Navigate to the first non-blank cell in the same row as the active cell. | -| Ctrl + Down | Navigate to the last cell that is not blank in the same column as the active cell. | -| Ctrl + Shift + Left | Extend the cell selection to the previous non-blank cell in the same row as the active cell. | -| Ctrl + Shift + Right | Extend the cell selection to the last non-blank cell in the same row as the active cell. | -| Ctrl + Shift + Up | Extend the selection of cells to the first non-blank cell in the same row as the active cell. | -| Ctrl + Shift + Down | Extend the selection of cells to the last non-blank cell in the same row as the active cell. | -| Shift + Alt + K | Open the `List All Sheets` dropdown option. | -| Up arrow | Navigate from the active cell to the previous cell in the same column. | -| Down arrow | Navigate from the active cell to the next cell in the same column. | -| Left arrow | Navigate from the active cell to the previous cell in the same row. | -| Right arrow | Navigate from the active cell to the next cell in the same row. | -| Page Up | Move page up. | -| Page Down | Move page down. | -| Shift + Up | Extend the selection of cells to the previous row. | -| Shift + Down | Extend the selection of cells to the next row. | -| Shift + Left | Extend the selection of cells to the previous column. | -| Shift + Right | Extend the selection of cells to the next column. | -| Ctrl + Top | Navigate to the non-blank cell before the active cell in the same column. | -| Ctrl + Shift + Top | Extend the cell selection to the previous non-blank cell in the same column as the active cell. | -| Ctrl + Shift + Bottom | Extend the cell selection to the last non-blank cell in the same column as the active cell. | -| Enter | Navigate the active cell to the next cell in the same column. | -| Shift + Enter | Navigate to the previous cell in the same column from the active cell. | -| Alt + Down | Open the list data validation menu and filter menu. | -| Alt + Up | Close the list data validation menu and filter menu. | -| Delete | Remove the contents of the cell. | -| Shift + Home | Extend the cell selection to the first column of a worksheet. | -| Shift + F11 | Add a new sheet. | +| Ctrl + Shift + ~ | Applies the **General** number format. | +| Ctrl + Shift + $ | Applies the **Currency** format with two decimal places and displays negative numbers in parentheses. | +| Ctrl + % | Applies the **Percentage** format with no decimal places. | +| Ctrl + ^ | Applies the **Scientific** number format with two decimal places. | +| Ctrl + Shift + # | Applies the **Date** format with the day, month, and year. | +| Ctrl + Shift + @ | Applies the **Time** format with the hour, minute, and AM or PM. | +| Ctrl + Shift + ! | Applies the **Number** format with two decimal places, a thousands separator, and a minus sign for negative values. | + +## Row and column operations + +| Shortcut | Description | +|----------|-------------| +| Ctrl + 9 | Hides the selected row. | +| Ctrl + 0 | Hides the selected column. | | Ctrl + Shift + 9 | Unhide the selected rows. | | Ctrl + Shift + 0 | Unhide the selected columns. | -| Ctrl + D | Fill the cell down. | -| Ctrl + R | Fill the cell right. | -| Alt + Enter | While editing, add a new line. | -| Enter | Complete the cell editing and select the cell below in the same column. | -| Shift + Enter | Complete the cell editing and select the cell above in the same column. | -| Tab | Complete the cell editing and select the next cell in the same row. | -| Shift + Tab | Complete the cell editing and select the previous cell in the same row. | -| Ctrl + Shift + F2 | Opens the comment editor for the active cell. Upon pressing the `Esc` key, the comment editor in focus will close. | -| Shift + F2 | Open the dialog box to add or edit notes for the desired cells. Meanwhile, upon pressing the `Esc` key, the dialog box for notes, when in focus, will save and close. | -| Alt | Focus on the active ribbon tab. | -| Left | Move the focus to the previous items in the ribbon content. | -| Right | Move the focus to the next items in the ribbon content. | -| Alt + Down | Open the ribbon dropdown menu. | -| Esc / Alt + Up | Close the ribbon dropdown menu. | + +## Open menu navigation + +| Shortcut | Description | +|----------|-------------| +| Up arrow | Moves the focus to the previous item in an open menu. | +| Down arrow | Moves the focus to the next item in an open menu. | +| Alt + Down | Opens the data validation list or filter menu for the active cell. | +| Alt + Up | Closes the data validation list or filter menu. | +| Spacebar or Enter | Activates the selected menu item or button. | + +## Ribbon navigation + +| Shortcut | Description | +|----------|-------------| +| Alt | Focuses the active Ribbon tab. | +| Alt + F | Opens the **File** menu. | +| Alt + H | Opens the **Home** tab. | +| Alt + N | Opens the **Insert** tab. | +| Alt + M | Opens the **Formulas** tab. | +| Alt + A | Opens the **Data** tab. | +| Alt + W | Opens the **View** tab. | +| Left arrow | Moves the focus to the previous item in the Ribbon. | +| Right arrow | Moves the focus to the next item in the Ribbon. | +| Alt + Down | Opens the selected Ribbon dropdown menu. | +| Esc / Alt + Up | Closes the Ribbon dropdown menu. | +| Ctrl + F8 | Expands or collapses the Ribbon content. | +| Ctrl + Shift + U | Expands or collapses the formula bar. | +| Shift + Alt + K | Opens the **List All Sheets** dropdown. | ## See Also diff --git a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/link.md b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/link.md index fbc6e0253a..58c1bd8e48 100644 --- a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/link.md +++ b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/link.md @@ -10,47 +10,49 @@ documentation: ug # Hyperlink in ASP.NET Core Spreadsheet control -Hyperlink is used to navigate to web links or cell reference within the sheet or to other sheets in Spreadsheet. You can use the [`allowHyperlink`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_AllowHyperlink) property to enable or disable hyperlink functionality. +Hyperlinks allow users to navigate to web pages, cell references within the current worksheet, or cells in other worksheets. Use the [`allowHyperlink`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_AllowHyperlink) property to enable or disable hyperlink functionality in the Spreadsheet. -N> * The default value for `allowHyperlink` property is `true`. +N> * The default value of the `allowHyperlink` property is `true`. ## Insert Link -You can insert a hyperlink in a worksheet cell for quick access to related information. +You can insert a hyperlink into a worksheet cell for quick access to related information. -**User Interface**: +To insert a hyperlink through the user interface: + +* Select the cell where you want to insert the hyperlink. +* Open the **Insert** tab in the Ribbon and select **Link**. +* Alternatively, right-click the cell and select **Hyperlink** from the context menu, or press `Ctrl + K`. +* Enter the destination and display text in the dialog, and then apply the changes. -In the active spreadsheet, click the cell where you want to create a hyperlink. Insert hyperlink can be done by any of the following ways: -* Select the INSERT tab in the Ribbon toolbar and choose the `Link` item. -* Right-click the cell and then click Hyperlink item in the context menu, or you can press Ctrl+K. -* Use the `addHyperlink()` method programmatically. +You can also use the `addHyperlink()` method to insert a hyperlink programmatically. ## Edit Hyperlink -You can change an existing hyperlink in your workbook by changing its destination or the text that is used to represent it. +You can edit an existing hyperlink by changing its destination or display text. **User Interface**: -In the active spreadsheet, Select the cell that contains the hyperlink that you want to change. Editing the hyperlink while opening the dialog can be done by any one of the following ways: +In the active Spreadsheet, select the cell containing the hyperlink. You can open the **Edit Link** dialog in one of the following ways: -* Select the INSERT tab in the Ribbon toolbar and choose the `Link` item. -* Right-click the cell and then click Edit Hyperlink item in the context menu, or you can press Ctrl+K. +* Select the **Insert** tab in the Ribbon, and then select **Link**. +* Right-click the cell and select **Edit Hyperlink** from the context menu, or press `Ctrl + K`. -In the Edit Link dialog box, make the changes that you want, and click UPDATE. +In the **Edit Link** dialog, make the required changes, and then click **Update**. ## Remove Hyperlink -Performing this operation remove a single hyperlink without losing the display text. +Removing a hyperlink deletes the link without removing its display text. **User Interface**: -In the active spreadsheet, click the cell where you want to remove a hyperlink. remove hyperlink can be done by any of the following ways: +In the active Spreadsheet, select the cell where you want to insert a hyperlink. You can insert a hyperlink in one of the following ways: * Right-click the cell and then click Remove Hyperlink item in the context menu. * Use the `removeHyperlink()` method programmatically. -## How to change target attribute +## Change the hyperlink target -There is an event named `beforeHyperlinkClick` which triggers only on clicking hyperlink. You can customize where to open the hyperlink by using the `target` property in the arguments of that event. +The `beforeHyperlinkClick` event is triggered before a hyperlink is opened. Use the `target` property in the event arguments to specify where the hyperlink opens. {% tabs %} {% highlight cshtml tabtitle="CSHTML" %} @@ -65,7 +67,7 @@ There is an event named `beforeHyperlinkClick` which triggers only on clicking h ## Limitations -* Inserting hyperlink not supported for multiple ranges. +* Inserting hyperlinks into multiple ranges is not supported. ## See Also diff --git a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/mobile-responsiveness.md b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/mobile-responsiveness.md index 3d0c1f0c0f..e177de9baf 100644 --- a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/mobile-responsiveness.md +++ b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/mobile-responsiveness.md @@ -12,6 +12,6 @@ documentation: ug The Spreadsheet control rendered in desktop mode will be adaptive in all mobile devices where the layout gets adjusted based on their parent element’s dimensions to accommodate any resolution. -You can see the overflowed items of ribbon header, ribbon content, and sheet tab using touch and swipe action. The right navigation arrow is added at the end of the ribbon content through which the user can navigate towards overflowed items. Once you reached the rightmost end of the ribbon content, the right navigation arrow will change to left navigation arrow through which you can navigate to the left of the ribbon content. +You can access overflowed items in the Ribbon header, Ribbon content, and sheet tabs using touch and swipe gestures. A right navigation arrow appears at the end of the Ribbon content to provide access to overflowed items. When you reach the rightmost end of the Ribbon content, the right navigation arrow changes to a left navigation arrow, allowing you to navigate back. ![Spreadsheet Adaptive Mode](./images/spreadsheet_adaptive_mode.gif) diff --git a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/notes.md b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/notes.md index 696bb0fa73..69b1092065 100644 --- a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/notes.md +++ b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/notes.md @@ -9,13 +9,13 @@ documentation: ug # Notes in ASP.NET Core Spreadsheet control -The **Notes** feature is used to insert comments, provide feedback, suggest changes, or leave remarks on specific cells while reviewing documents in the Spreadsheet. You can enable or disable the notes functionality using the [enableNotes](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_EnableNotes) property, which defaults to **true**. +The **Notes** feature allows users to add feedback, suggestions, or remarks to specific cells without changing the cell content. You can enable or disable the notes functionality using the [enableNotes](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_EnableNotes) property, which defaults to **true**. -When opening the Excel document with notes in the Spreadsheet, they will be displayed in the control. The cells containing notes will be indicated with a red colored triangle at the top-right corner. Hovering the mouse over these cells will display the content of the notes. +When an Excel document containing notes is opened in the Spreadsheet, a red triangle appears in the top-right corner of each cell that contains a note. Hover over the cell to display the note content. ![Adding, editing, and deleting a note in Spreadsheet](./images/spreadsheet_add_edit_delete_note.gif) -In the below example, you can add, edit, save, and delete notes. +In the following example, you can add, edit, save, and delete notes. {% tabs %} {% highlight cshtml tabtitle="CSHTML" %} @@ -37,7 +37,7 @@ In the active worksheet, you can add a note in the following ways: * Use the `updateCell` method with the note model to add a note to a specific cell. * Bind notes via code-behind during initial load by associating the note model with the cell model. -A dialog box will open where you can enter the note content. After entering the content, you can either click on other cells or press the Esc button to automatically save the note and close the dialog box. +A dialog opens where you can enter the note content. To save the note and close the dialog, select another cell or press the Esc key. ## Editing a note @@ -48,7 +48,7 @@ In the active worksheet, you can modify the content of existing notes in the doc * **Ribbon**: Select the cell containing the note, navigate to the **Review** tab, click the **Notes** dropdown, and select **Edit Note**. * **Keyboard Shortcut**: Select the cell containing the note and press Shift + F2. -The note editor dialog box will open with the existing content. After editing the content, you can either click on other cells or press the Esc button to automatically save the changes and close the dialog box. +The note editor opens with the existing content. After editing the note, select another cell or press the Esc key to save the changes and close the dialog. ## Deleting a note @@ -58,7 +58,7 @@ You can remove notes from cells using the following ways: * **Context Menu**: Right-click the cell containing the note and select **Delete Note**. * **Ribbon**: Select the cell containing the note, navigate to the **Review** tab, click the **Notes** dropdown, and select **Delete Note**. -The note will be removed from the cell, and the red triangle indicator will be removed. +After the note is deleted, its content and red triangle indicator are removed from the cell. ## Navigating between notes @@ -105,7 +105,7 @@ To toggle the visibility of a note: ## Show All Notes -The **Show All Notes** option enables you to display all notes in the current worksheet simultaneously as sticky notes, simplifying the review of multiple comments at a glance. +The **Show All Notes** option displays all notes in the current worksheet simultaneously as sticky notes, simplifying the review of multiple notes. To activate: @@ -127,11 +127,15 @@ The Spreadsheet data, including notes, can be saved and exported as an Excel doc ## Disabling notes -To disable the note functionality, you need to set the [enableNotes](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_EnableNotes) property to **false**. After disabling, the notes in the document will not be shown when opened in the Spreadsheet. The **"Add Note"** option will not be shown in the context menu. The keyboard shortcuts for the note functionality will not work. +Set the [enableNotes](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_EnableNotes) property to `false` to disable note functionality. When notes are disabled: + +* Existing notes are not displayed when the document is opened. +* The **Add Note** option is not displayed in the context menu. +* Keyboard shortcuts associated with notes do not work. ![Spreadsheet with notes feature disabled](./images/spreadsheet_notes_disable.png) -In the below example, the note functionality is disabled in the Spreadsheet. +In the following example, the note functionality is disabled in the Spreadsheet. {% tabs %} {% highlight cshtml tabtitle="CSHTML" %} @@ -146,7 +150,7 @@ In the below example, the note functionality is disabled in the Spreadsheet. The notes can be added initially when the Spreadsheet loads using cell data binding. You need to use the `notes` property in the cell settings to add notes to the Spreadsheet. -In the below example, you can navigate between notes using **Previous Note** and **Next Note** options, toggle individual note visibility with **Show/Hide Note**, display all notes at once using **Show All Notes** and see how notes are added using the `updateCell` method in the `created` event. +In the following example, you can navigate between notes using **Previous Note** and **Next Note** options, toggle individual note visibility with **Show/Hide Note**, display all notes at once using **Show All Notes** and see how notes are added using the `updateCell` method in the `created` event. {% tabs %} {% highlight cshtml tabtitle="CSHTML" %} diff --git a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/open-save.md b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/open-save.md index 3b2916f8f4..ef9c6f9a20 100644 --- a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/open-save.md +++ b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/open-save.md @@ -10,7 +10,7 @@ documentation: ug # Open and Save in ASP.NET Core Spreadsheet control -To import an excel file, it needs to be read and converted to client side Spreadsheet model. The converted client side Spreadsheet model is sent as JSON which is used to render Spreadsheet. Similarly, when you save the Spreadsheet, the client Spreadsheet model is sent to the server as JSON for processing and saved. Server configuration is used for this process. +To import an Excel file, the file is read and converted into a client-side Spreadsheet model. The converted model is returned as JSON and used to render the Spreadsheet. Similarly, when saving, the client-side Spreadsheet model is sent to the server as JSON for processing and export. These operations require server-side configuration. ## Open @@ -18,7 +18,7 @@ The Spreadsheet component opens an Excel document with its data, style, format, **User Interface**: -In user interface you can open an Excel document by clicking `File > Open` menu item in ribbon. +In the user interface, choose `File > Open` from the Ribbon to open an Excel document. The following sample shows the `Open` option by using the [`openUrl`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_OpenUrl) property in the Spreadsheet control. You can also use the [`beforeOpen`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_BeforeOpen) event to trigger before opening an Excel file. @@ -42,11 +42,18 @@ Find the below table for the beforeOpen event arguments. | requestData | object | To provide the Form data. | N> * Use `Ctrl + O` keyboard shortcut to open Excel documents. -
* The default value of the [allowOpen](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_AllowOpen) property is `true`. For demonstration purpose, we have showcased the [allowOpen](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_AllowOpen) property in previous code snippet. +
* The default value of the [allowOpen](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_AllowOpen) property is `true`. For demonstration purpose, the previous example explicitly configures the [allowOpen](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_AllowOpen) property. ### Open an excel file using a file uploader -If you explore your machine to select and upload an excel document using the file uploader, you will receive the uploaded document as a raw file in the `success` event of the file uploader. In this `success` event, you should pass the received raw file as an argument to the Spreadsheet's `open` method to see the appropriate output. +To open an Excel file using a file uploader: + +1. Select and upload an Excel file through the file uploader. +2. Access the uploaded file from the uploader's `success` event. +3. Pass the file to the Spreadsheet `open` method. +4. Verify that the uploaded Excel file is loaded into the Spreadsheet. + +The following example demonstrates how to open an Excel file using a file uploader. The following code example shows how to import an excel document using file uploader in spreadsheet. @@ -350,7 +357,7 @@ The [attachment](https://www.syncfusion.com/downloads/support/directtrac/general ### Add custom header during open -You can add your own custom header to the open action in the Spreadsheet. For processing the data, it has to be sent from server to client side and adding customer header can provide privacy to the data with the help of Authorization Token. Through the [`beforeOpen`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_BeforeOpen) event, the custom header can be added to the request during open action. +You can add your own custom header to the open action in the Spreadsheet. For processing the data, it has to be sent from server to client side and adding custome header can provide privacy to the data with the help of Authorization Token. Through the [`beforeOpen`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_BeforeOpen) event, the custom header can be added to the request during open action. {% tabs %} {% highlight cshtml tabtitle="CSHTML" %} @@ -391,11 +398,11 @@ The following list of Excel file formats are supported in Spreadsheet: ## Save -The Spreadsheet component saves its data, style, format, and more as Excel file document. To enable this feature, set [`allowSave`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_AllowSave) as `true` and assign service url to the [`saveUrl`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_SaveUrl) property. +The Spreadsheet component saves its data, styles, formatting, and other supported features as an Excel document. To enable this feature, set [`allowSave`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_AllowSave) as `true` and assign service url to the [`saveUrl`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_SaveUrl) property. **User Interface**: -In user interface, you can save Spreadsheet data as Excel document by clicking `File > Save As` menu item in ribbon. +In the user interface, choose `File > Save As` from the Ribbon to save the Spreadsheet data as an Excel document. The following sample shows the `Save` option by using the [`saveUrl`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_SaveUrl) property in the Spreadsheet control. You can also use the [`beforeSave`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_BeforeSave) event to trigger before saving the Spreadsheet as an Excel file. diff --git a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/overview.md b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/overview.md index 8734b0bdc5..2589644242 100644 --- a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/overview.md +++ b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/overview.md @@ -9,14 +9,14 @@ documentation: ug # Overview of the ASP.NET Core Spreadsheet Control -The [ASP.NET Core Spreadsheet Editor](https://www.syncfusion.com/spreadsheet-editor-sdk/asp-net-core-spreadsheet-editor) is an user interactive control to organize and analyze data in tabular format with configuration options for customization. It will load data by importing an Excel/CSV file or from local and remote data sources such as JSON, RESTful services, OData services, and more. The populated data can be exported as Excel with XLSX, XLS, CSV and PDF formats. +The [ASP.NET Core Spreadsheet Editor](https://www.syncfusion.com/spreadsheet-editor-sdk/asp-net-core-spreadsheet-editor) is a user-interactive component for organizing and analyzing data in a tabular format. It provides various configuration options for customization. The Spreadsheet can load data by importing Excel and CSV files or by binding local and remote data sources, such as JSON, RESTful services, and OData services. The populated data can be exported in XLSX, XLS, CSV, and PDF formats. ![ASP.NET Core Spreadsheet Control](./images/overview-banner.png) ## Key features -* [Data sources](data-binding): Bind the Spreadsheet control with an array of objects or data from a web service using `DataManager`. -* [Virtualization](scrolling#virtual-scrolling): Provides the option to load large amount of data without performance degradation. +* [Data sources](data-binding): Binds the Spreadsheet to an array of objects or data from a web service using `DataManager`. +* [Virtualization](scrolling#virtual-scrolling): Allows large amounts of data to significant performance degradation. * [Selection](selection): Provides the option to select a cell or range of cells. * [Editing](editing): Provides the option to dynamically edit a cell. * [Formulas](formulas): Provides built-in calculation library with pre-defined formulas and named range support. @@ -25,16 +25,16 @@ The [ASP.NET Core Spreadsheet Editor](https://www.syncfusion.com/spreadsheet-edi * [Number formatting](formatting#number-formatting): Provides the option to format the cell value. * [Open](open-save#open): Provides the option to open Excel and CSV files in Spreadsheet. * [Save](open-save#save): Provides the option to save Spreadsheet data as Excel, CSV, and PDF documents. -* [Sorting](sort): Helps you to arrange the data to particular order in a selected range of cells. -* [Filtering](filter): Helps you to view specific rows in the Spreadsheet by hiding the other rows. -* [Undo Redo](undo-redo): Provides the option to perform undo redo operations in Spreadsheet. -* [Hyperlink](link): Provides the option to navigate to web link or cell reference within the sheet or to other sheet in Spreadsheet. -* [Resize](mobile-responsiveness): Allows you to change the row height and column width. Auto fit the rows and columns based on its content. -* [Wrap text](cell-range#wrap-text): Provides the option to display the large content as multiple lines in a single cell. +* [Sorting](sort): Allows you to arrange data in a particular order within a selected range of cells. +* [Filtering](filter): Displays specific rows in the Spreadsheet by hiding the others. +* [Undo Redo](undo-redo): Allows users to undo and redo actions in the Spreadsheet. +* [Hyperlink](link): Allows users to navigate to a web link, a cell reference within the current worksheet, or a cell in another worksheet. +* [Resize](mobile-responsiveness): Allows you to change row heights and column widths and autofit rows and columns based on their content. +* [Wrap text](cell-range#wrap-text): Displays large content on multiple lines within a single cell. * [Data validation](cell-range#data-validation): Provides the option to validate edited values based on data validation rules defined for a cell or range of cells. * [Find and replace](searching): Provides the option to find the data and replace it across all sheets in Spreadsheet. * [Protect sheet](protect-sheet): Provides the option to restrict user actions like cell editing, row and column insertion, deletion, and resizing. -* [Borders](formatting#borders): Provides the option to customize cell gridlines such as color and its style for enhanced UI. +* [Borders](formatting#borders): Allows you to customize cell borders, including their color and style. * [Show/hide](worksheet#sheet-visibility): Provides the option to show/hide rows, columns and sheets. * [Insert/delete](rows-and-columns#insert): Provides the option to insert/delete rows, columns and sheets. * [Merge cells](cell-range#merge-cells): Provides the option to combine two or more cells located in the same row or column into a single cell. @@ -42,7 +42,7 @@ The [ASP.NET Core Spreadsheet Editor](https://www.syncfusion.com/spreadsheet-edi * [Autofill](cell-range#auto-fill): Provides the option to fill or copy a series or pattern of values and formats into adjacent cells in any direction. * [Clear](cell-range#clear): Provides the option to clear the content, formats, and hyperlinks applied to a cell or range of cells in a Spreadsheet. * [Aggregates](formulas): Provides the option to check the sum, average, count, and more for the selected cells or range in the sheet. -* [Picture](illustrations#image): Allows you to view, insert, and modify a picture in a Spreadsheet with customizing options. +* [Picture](illustrations#image): Allows you to insert, view, resize, and reposition images in the Spreadsheet. * [Chart](illustrations#chart): Transforms your Spreadsheet data to an intuitive overview for better understanding and to make smart business decisions. * [Freeze panes](freeze-pane): Allows you to keep the specified rows and columns always visible at the top and left side of the sheet while scrolling through the sheet. * [Password protection](protect-sheet#protect-workbook): Allows you to protect the workbook with a password. @@ -51,4 +51,4 @@ The [ASP.NET Core Spreadsheet Editor](https://www.syncfusion.com/spreadsheet-edi * [Right-to-left (RTL)](global-local#right-to-left-rtl): Aligns content in the Spreadsheet control from right to left. * [Templates](template): Templates can be used to create custom user experiences in the Spreadsheet. * [Globalization](global-local): Personalize the Spreadsheet control with different languages, as well as culture-specific number, date, and time formatting. -* [Accessibility](accessibility): Provides with built-in accessibility support which helps to access all the Spreadsheet control features through the keyboard, screen readers, or other assistive technology devices. +* [Accessibility](accessibility): Provides built-in accessibility support that allows users to access Spreadsheet features using the readers, and other assistive technologies. diff --git a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/performance-best-practices.md b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/performance-best-practices.md index 2bfe1c348a..244627530d 100644 --- a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/performance-best-practices.md +++ b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/performance-best-practices.md @@ -7,7 +7,7 @@ control: Performance documentation: ug --- -# Performance Best Practices in EJ2 ASP.NET CORE Spreadsheet control +# Performance Best Practices in the EJ2 ASP.NET CORE Spreadsheet control Performance optimization is crucial when working with large datasets in the [ASP.NET Core Spreadsheet Editor](https://www.syncfusion.com/aspnet-core-ui-controls/spreadsheet). This documentation outlines best practices to enhance data handling efficiency and ensure a smooth, responsive user experience during various spreadsheet operations. @@ -30,9 +30,9 @@ These chunks are combined on the client side to load the Excel data smoothly int To enable the chunk response processing feature, you can refer to the following UG section: * [Chunk Response Processing](https://ej2.syncfusion.com/aspnetcore/documentation/spreadsheet/open-save#chunk-response-processing) -### Configure JSON serialization options during open +### Configure JSON deserialization options during open -Serialization options in the Spreadsheet allows you to exclude specific features—such as styles, formats, charts, images, wrap, etc.—from the `Workbook JSON object` when opening it in the Spreadsheet using the `openFromJson` method. By skipping unnecessary features, you can significantly improve performance, especially when working with large or complex workbooks. +Deserialization options in the Spreadsheet allow you to exclude specific features, such as styles, formats, charts, images, and text wrapping, when opening a workbook JSON object using the `openFromJson` method. By skipping unnecessary features, you can significantly improve performance, especially when working with large or complex workbooks. This is particularly useful when: * You need only the raw data without formatting. @@ -45,7 +45,7 @@ Refer to the following UG section to learn how to configure these options: ### Configuring threshold limits -To improve performance when importing large Excel files into the Spreadsheet component, you can configure thresholds for both the maximum number of cells `MaximumDataLimit` and the file size `MaximumFileSize`. These limits help prevent delays or potential server timeouts by restricting excessively large files from being imported. +To improve performance when importing large Excel files, configure the `MaximumDataLimit` and `MaximumFileSize` properties on the server. The `MaximumDataLimit` property specifies the maximum number of cells, while the `MaximumFileSize` property specifies the maximum file size in bytes. These limits help prevent delays or potential server timeouts by restricting excessively large files from being imported. When these thresholds are exceeded: * The Spreadsheet displays an alert dialog indicating that the file is large. @@ -86,7 +86,7 @@ To learn how to configure these parsing options, please refer to the UG section ### Manual calculation mode -Manual Calculation Mode in the Spreadsheet is a performance optimization feature that allows you to delay formula recalculations until they are explicitly triggered. By default, the Spreadsheet automatically recalculates formulas whenever a dependent cell is edited or changed. While this behavior works well for small datasets, it can result in noticeable lag or UI freezing when working with large spreadsheets that contain many formulas or complex calculation chains. +Manual Calculation Mode in the Spreadsheet is a performance optimization feature that allows you to delay formula recalculations until they are explicitly triggered. By default, the Spreadsheet automatically recalculates formulas whenever a dependent cell changes. While this behavior works well for small datasets, it can result in noticeable lag or UI freezing when working with large spreadsheets that contain many formulas or complex calculation chains. To prevent such performance issues during bulk operations—such as importing data, applying formats, or setting multiple formulas — manual calculation mode gives developers control over when recalculations should occur. @@ -125,7 +125,7 @@ The following code example shows how to set `isFullPost` to **false** in the Spr ### Configure JSON serialization options during save -Serialization options in the Spreadsheet allows you to exclude specific features such as styles, formats, charts, images, wrap, etc. from the `Workbook JSON object` when saving it using the `saveAsJson` method in the Spreadsheet. By skipping unnecessary features, you can significantly improve performance, especially when working with large or complex workbooks. +Serialization options in the Spreadsheet allow you to exclude specific features, such as styles, number formats, charts, images, and wrap, from the `Workbook JSON object` when saving it using the `saveAsJson` method. Skipping unnecessary features can improve performance when working with large or complex workbooks. This is particularly useful when: * You need only the raw data without formatting. @@ -142,16 +142,16 @@ Refer to the following UG section to learn how to configure these options: ### Disabling aggregate calculation -When working with large datasets in the Spreadsheet, user interactions such as selecting a large range of cells can experience delays. This occurs because, by default, the Spreadsheet performs aggregate calculations (e.g., SUM, AVERAGE, COUNT, MIN, and MAX) on the selected range and displays the results in the sheet tab panel at the bottom-right corner. +When working with large datasets, selecting a large range of cells may cause delays because the Spreadsheet calculates aggregate values, such as `SUM`, `AVERAGE`, `COUNT`, `MIN`, and `MAX`, for the selected range. To enhance the responsiveness of cell selection, particularly in performance-critical scenarios, consider disabling unnecessary aggregate calculations using the [`showAggregate`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_ShowAggregate) property. Benefits: * Reduces selection lag when dealing with large data ranges. -* Prevents real-time computation of formulas like SUM, AVERAGE, MIN, and MAX for large selections. +* Prevents real-time aggregate calculations, such as `SUM`, `AVERAGE`, `COUNT`, `MIN`, and `MAX`, for large selections. * Keeps the UI responsive during large selection operations. -You can disable aggregate calculation using the following code example: +Set the `showAggregate` property to `false` to disable aggregate calculations for selected ranges. When disabled, aggregate results are not displayed in the sheet tab panel. {% tabs %} {% highlight cshtml tabtitle="CSHTML" %} diff --git a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/print.md b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/print.md index 76de46051e..724ddc36c1 100644 --- a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/print.md +++ b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/print.md @@ -14,19 +14,27 @@ The printing functionality allows end-users to print all contents, such as table ## Default printing -The active worksheet in the Spreadsheet can be printed by selecting the **File > Print** option in the ribbon menu. You can also initiate the printing using the `Ctrl` + `P` keyboard shortcut when the Spreadsheet is in focus. These two options print only the data from the active sheet without including rows headers, column headers and grid lines. +To print the active worksheet: + +1. Ensure that the Spreadsheet is in focus. +2. Open the **File** menu in the Ribbon and choose **Print**. Alternatively, press `Ctrl + P`. +3. Review the active worksheet in the browser's print dialog. +4. Select the printer and configure the available browser print settings. +5. Start the print operation. + +By default, only data from the active worksheet is printed. Row headers, column headers, and gridlines are excluded. ![Spreadsheet with print option](./images/spreadsheet_print_in_ribbon_menu.png) ## Custom printing -The active worksheet or entire workbook can be printed with customized options using the `print` method. The `print` method takes one parameter, that is, `printOptions`, which can be used for customization. +Use the `print` method to print the active worksheet or the entire workbook with customized options. The method accepts a `printOptions` object containing the following properties: -The `printOptions` contain three properties, as described below. - -* `type` - It specifies whether to print the current sheet or the entire workbook. The value for this property is either **ActiveSheet** or **Workbook**. -* `allowGridLines` - This property specifies whether grid lines should be included in the printing or not. The grid lines will be included in the printed copy when set to **true**. When set to **false**, it will not be available. -* `allowRowColumnHeader` - This property specifies whether row and column headers should be included in the printing or not. The headers will be included in the printed copy when set to **true**. When set to **false**, it will not be available. +| Property | Description | +|----------|-------------| +| `type` | Specifies whether to print the active worksheet or the entire workbook. The supported values are `ActiveSheet` and `Workbook`. | +| `allowGridLines` | Specifies whether gridlines are included in the printed output. Set this property to `true` to include gridlines or `false` to exclude them. | +| `allowRowColumnHeader` | Specifies whether row and column headers are included in the printed output. Set this property to `true` to include the headers or `false` to exclude them. | > When the `print` method is called without any parameters, the default printing will be performed. @@ -41,7 +49,10 @@ The `printOptions` contain three properties, as described below. ## Disable printing -The printing functionality in the Spreadsheet can be disabled by setting the [`allowPrint`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_AllowPrint) property to **false**. After disabling, the **"Print"** option will not be available in the **"File"** menu of the ribbon and as a keyboard shortcut. +Set the [`allowPrint`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_AllowPrint) property to `false` to disable printing. When printing is disabled: + +* The **Print** option is not displayed in the **File** menu. +* The Spreadsheet print keyboard shortcut is unavailable. ![Spreadsheet with print option disabled](./images/spreadsheet_print_disable.png) @@ -56,6 +67,6 @@ The printing functionality in the Spreadsheet can be disabled by setting the [`a ## Limitations -* When printing the document, changing the page orientation to landscape is not supported in both the `print` method and print preview dialog of the web browser. +* Changing the page orientation to landscape is not supported by the `print` method or through the browser's print preview dialog. * The styles provided for the data validation functionality will not be available in the printed copy of the document. * The content added to the cell templates, such as HTML elements, Syncfusion® controls, and others, will not be available in the printed copy of the document. diff --git a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/protect-sheet.md b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/protect-sheet.md index 3bb05009f8..0151c17811 100644 --- a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/protect-sheet.md +++ b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/protect-sheet.md @@ -10,25 +10,27 @@ documentation: ug # Protection in ASP.NET Core Spreadsheet Control -Sheet protection helps you to prevent the users from modifying the data in the spreadsheet. +Sheet protection prevents users from modifying data in the Spreadsheet. ## Protect Sheet -Protect sheet feature helps you to prevent the unknown users from accidentally changing, editing, moving, or deleting data in a spreadsheet. And you can also protect the sheet with password. You can use the [`isProtected`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_IsProtected) property to enable or disable the Protecting functionality. +The Protect Sheet feature prevents users from accidentally changing, editing, moving, or deleting data in a worksheet. You can also protect the sheet with a password. -N> The default value for `isProtected` property is `false`. +Use the [`isProtected`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_IsProtected) property to enable or disable sheet protection. + +N> The default value of the `isProtected` property is `false`. -By default in protected sheet, selecting, formatting, inserting, deleting functionalities are disabled. To enable some of the above said functionalities the `protectSettings` options are used in a protected spreadsheet. +By default, selection, formatting, insertion, and deletion operations are disabled in a protected sheet. Use the `protectSettings` options to allow specific operations while the sheet remains protected. The available `protectSettings` options in spreadsheet are, -| Options | Uses | -|-----|------| -| `Select Cells` | Used to perform Cell Selection. | -| `Format Cells` | Used to perform Cell formatting. | -| `Format Rows` | Used to perform Row formatting. | -| `Format Columns` | Used to perform Column formatting. | -| `Insert Link` | Used to perform Hyperlink Insertions. | +| Option | Description | +|--------|-------------| +| `Select Cells` | Allows cell selection. | +| `Format Cells` | Allows cell formatting. | +| `Format Rows` | Allows row formatting. | +| `Format Columns` | Allows column formatting. | +| `Insert Link` | Allows hyperlink insertion. | N> * The default value for all `protectSettings` options are `false`. @@ -36,11 +38,14 @@ By default, the `Protect Sheet` module is injected internally into the Spreadshe **User Interface**: -In the active Spreadsheet, the sheet protection can be done by any of the following ways: +To protect a sheet through the user interface: -* Select the Protect Sheet item in the Ribbon toolbar under the Data Tab, and then select your desired options. -* Right-click the sheet tab, select the Protect Sheet item in the context menu, and then select your desired options. -* Use the `protectSheet()` method programmatically. +* Open the **Data** tab in the Ribbon and choose **Protect Sheet**. Alternatively, right-click the sheet tab and choose **Protect Sheet** from the context menu. +* Select the operations that users are allowed to perform on the protected sheet. +* Enter and confirm the password, if required. +* Apply the protection settings. + +You can also use the `protectSheet()` method to protect a sheet programmatically. The following example shows `Protect Sheet` functionality with password in the Spreadsheet control. @@ -61,19 +66,19 @@ The following example shows `Protect Sheet` functionality with password in the S ## Unprotect Sheet -Unprotect sheet is used to enable all the functionalities that are already disabled in a protected spreadsheet. +Unprotecting a sheet re-enables the functionality that was disabled when the sheet was protected. -**User Interface**: +To unprotect a sheet: -In the active Spreadsheet, the sheet can be unprotected by any of the following ways: +* Open the **Data** tab in the Ribbon and choose **Unprotect Sheet**. Alternatively, right-click the sheet tab and choose **Unprotect Sheet** from the context menu. +* Enter the password, if the sheet is password-protected. +* Confirm the operation. -* Select the `Unprotect Sheet` item in the Ribbon toolbar under the Data Tab. -* Right-click the sheet tab, select the `Unprotect Sheet` item in the context menu. -* Use the `unprotectSheet()` method programmatically. +You can also use the `unprotectSheet()` method to unprotect a sheet programmatically. ## Unlock the particular cells in the protected sheet -In protected spreadsheet, to make some particular cell or range of cells are editable, you can use `lockCells()` method, with the parameter `range` and `isLocked` property as false. +To make a specific cell or range editable in a protected sheet, use the `lockCells()` method. Pass the required range and set `isLocked` to `false`. {% tabs %} {% highlight cshtml tabtitle="CSHTML" %} @@ -91,10 +96,10 @@ Previously, you could make cells read-only by protecting the entire sheet using Now, you can make an entire row, an entire column, or a specific range of cells read-only using the `setRangeReadOnly` method without protecting the entire sheet. This method accepts three parameters, as detailed in the following table: | Parameter | Description | -|-----|------| -| `readOnly` | Specifies whether an entire row, an entire column, or a specific range of cells should be set as read-only (**true**) or editable (**false**). |. -| `range` | Specifies the particular range of cells to be set as read-only. | -| `sheetIndex` | Specifies the index of the sheet. | +|-----------|-------------| +| `readOnly` | Specifies whether the row, column, or cell range is read-only (`true`) or editable (`false`). | +| `range` | Specifies the row, column, or cell range to configure. | +| `sheetIndex` | Specifies the index of the worksheet. | You can make an entire row, an entire column, or a specific range of cells read-only by passing the range as shown in the code snippet below: @@ -149,7 +154,7 @@ The following example shows `Protect Workbook` by using the [`isProtected`](http -The following example shows `Protect Workbook` by using the [`password`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_Password) property in the Spreadsheet control. To unprotect the workbook, click the unprotect workbook button in the data tab and provide the password as Syncfusion® in the dialog box. +The following example shows `Protect Workbook` by using the [`password`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_Password) property in the Spreadsheet control. To unprotect the workbook, choose **Unprotect Workbook** from the **Data** tab and enter `Syncfusion` in the password dialog. {% tabs %} {% highlight cshtml tabtitle="CSHTML" %} diff --git a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/ribbon.md b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/ribbon.md index e936f08242..b2fb97bbdb 100644 --- a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/ribbon.md +++ b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/ribbon.md @@ -10,30 +10,25 @@ documentation: ug # Ribbon in ASP.NET Core Spreadsheet control -It helps to organize a spreadsheet’s features into a series of tabs. By clicking the expand or collapse icon, you can expand or collapse the ribbon toolbar dynamically. +The Ribbon organizes Spreadsheet features into a series of tabs. Click the expand or collapse icon to dynamically expand or collapse the Ribbon. ## Ribbon Customization -You can customize the ribbon using the following methods, - -| Method | Action | -|-------|---------| -| `hideRibbonTabs` | Used to show or hide the existing ribbon tabs. | -| `enableRibbonTabs` | Used to enable or disable the existing -ribbon tabs. | -| `addRibbonTabs` | Used to add custom ribbon tabs. | -| `hideToolbarItems`| Used to show or hide the existing ribbon -toolbar items. | -| `enableToolbarItems` | Used to enable or disable the specified -toolbar items. | -| `addToolbarItems` | Used to add the custom items in ribbon -toolbar. | -| `hideFileMenuItems` | Used to show or hide the ribbon file menu -items. | -| `enableFileMenuItems`| Used to enable or disable file menu items. | -| `addFileMenuItems`| Used to add custom file menu items. | - -The following code example shows the usage of ribbon customization. +You can customize the Ribbon using the following methods: + +| Method | Description | +|--------|-------------| +| `hideRibbonTabs` | Shows or hides existing Ribbon tabs. | +| `enableRibbonTabs` | Enables or disables existing Ribbon tabs. | +| `addRibbonTabs` | Adds custom Ribbon tabs. | +| `hideToolbarItems` | Shows or hides existing Ribbon toolbar items. | +| `enableToolbarItems` | Enables or disables specified Ribbon toolbar items. | +| `addToolbarItems` | Adds custom items to the Ribbon toolbar. | +| `hideFileMenuItems` | Shows or hides File-menu items. | +| `enableFileMenuItems` | Enables or disables File-menu items. | +| `addFileMenuItems` | Adds custom File-menu items. | + +The following code example demonstrates how to customize the Ribbon. {% tabs %} {% highlight cshtml tabtitle="CSHTML" %} diff --git a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/rows-and-columns.md b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/rows-and-columns.md index 8e291b564b..384297c0b4 100644 --- a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/rows-and-columns.md +++ b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/rows-and-columns.md @@ -10,7 +10,7 @@ documentation: ug # Rows and columns in ASP.NET Core Spreadsheet control -Spreadsheet is a tabular format consisting of rows and columns. The intersection point of rows and columns are called as cells. The list of operations that you can perform in rows and columns are, +A Spreadsheet consists of rows and columns arranged in a tabular format. The intersection of a row and a column is called a cell. You can perform the following operations on rows and columns: * Insert * Delete @@ -22,10 +22,10 @@ You can insert rows or columns anywhere in a spreadsheet. Use the [`allowInsert` ### Row -The rows can be inserted in the following ways, +You can insert rows in one of the following ways: -* Using `insertRow` method, you can insert the rows once the component is loaded. -* Using context menu, insert the empty rows in the desired position. +* Select a row header, right-click it, and choose the required insert option from the context menu. +* Use the `insertRow` method to insert rows programmatically after the Spreadsheet is rendered. The following code example shows the options for inserting rows in the spreadsheet. @@ -42,10 +42,10 @@ The following code example shows the options for inserting rows in the spreadshe ### Column -The columns can be inserted in the following ways, +You can insert columns in one of the following ways: -* Using `insertColumn` method, you can insert the columns once the component is loaded. -* Using context menu, insert the empty columns in the desired position. +* Select a column header, right-click it, and choose the required insert option from the context menu. +* Use the `insertColumn` method to insert columns programmatically after the Spreadsheet is rendered. The following code example shows the options for inserting columns in the spreadsheet. @@ -64,10 +64,10 @@ The following code example shows the options for inserting columns in the spread Delete support provides an option for deleting the rows and columns in the spreadsheet. Use [`allowDelete`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_AllowDelete) property to enable or disable the delete option in Spreadsheet. -The rows and columns can be deleted dynamically in the following ways, +You can delete rows or columns in one of the following ways: -* Using `delete` method, you can delete the loaded rows and columns. -* Using context menu, you can delete the selected rows and columns. +* Select the required row or column headers, right-click the selection, and choose the appropriate delete option from the context menu. +* Use the `delete` method to delete rows or columns programmatically. The following code example shows the delete operation of rows and columns in the spreadsheet. @@ -88,21 +88,21 @@ You can show or hide the rows and columns in the spreadsheet through property bi ### Row -The rows can be hidden or shown through the following ways, +You can hide or show rows in one of the following ways: -* Using `hidden` property in row, you can hide/show the rows at initial load. -* Using `hideRow` method, you can hide the rows by specifying the start and end row index, set the last argument `hide` as `false` to unhide the hidden rows. -* Right-click on the row header and select the desired option from context menu +* Use the `hidden` property in the row model to hide rows during the initial rendering. +* Use the `hideRow` method to hide or show rows programmatically. Specify the start and end row indexes, and set the final `hide` argument to `false` to show hidden rows. +* Right-click the row header and choose the required option from the context menu. ### Column -The columns can be hidden or shown through following ways, +You can hide or show columns in one of the following ways: -* Using `hidden` property in columns, you can hide/show the columns at initial load. -* Using `hideColumn` method, you can hide the columns by specifying the start and end column index, set the last argument `hide` as `false` to unhide the hidden columns. -* Right-click on the column header and select the desired option from context menu +* Use the `hidden` property in the column model to hide columns during the initial rendering. +* Use the `hideColumn` method to hide or show columns programmatically. Specify the start and end column indexes, and set the final `hide` argument to `false` to show hidden columns. +* Right-click the column header and choose the required option from the context menu. -The following code example shows the hide/show rows and columns operation in the spreadsheet. +The following code example demonstrates how to hide and show rows and columns in the Spreadsheet. {% tabs %} {% highlight cshtml tabtitle="CSHTML" %} @@ -117,7 +117,7 @@ The following code example shows the hide/show rows and columns operation in the ## Size -You can change the size of rows and columns in the spreadsheet by using `setRowsHeight` and `setColumnsWidth` methods. +Use the `setRowsHeight` and `setColumnsWidth` methods to change the size of rows and columns in the Spreadsheet. ### Row @@ -125,9 +125,9 @@ You can change the height of single or multiple rows by using the `setRowsHeight You can provide the following type of ranges to the method: -* Single row range: `['2:2']` -* Multiple rows range: `['1:100']` -* Multiple rows with discontinuous range: `['1:10', '15:25', '30:40']` +* Single-row range: `['2:2']` +* Multiple-row range: `['1:100']` +* Multiple rows with discontinuous range:: `['1:10', '15:25', '30:40']` * Multiple rows with different sheets: `[Sheet1!1:50, 'Sheet2!1:50', 'Sheet3!1:50']` The following code example shows how to change the height for single/multiple rows in the spreadsheet. @@ -147,10 +147,10 @@ You can change the width of single or multiple columns by using the `setColumnsW You can provide the following type of ranges to the method: -* Single column range: `['F:F']` -* Multiple columns range: `['A:F']` -* Multiple columns with discontinuous range: `['A:C', 'G:I', 'K:M']` -* Multiple columns with different sheets: `[Sheet1!A:H, 'Sheet2!A:H', 'Sheet3!A:H']` +* Single-column range: `['F:F']` +* Multiple-column range: `['A:F']` +* Discontinuous column ranges: `['A:C', 'G:I', 'K:M']` +* Column ranges across different sheets: `[Sheet1!A:H, 'Sheet2!A:H', 'Sheet3!A:H']` The following code example shows how to change the width for single/multiple columns in the spreadsheet. @@ -163,9 +163,9 @@ The following code example shows how to change the width for single/multiple col {% endhighlight %} {% endtabs %} -## Changing text in column headers +## Change text in column headers -Using the [`beforeCellRender`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_BeforeCellRender) event, you can change the text in the column headers. In that event, you can use the `e-header-cell` class to identify the header cell element and update its text value. +Use the [`beforeCellRender`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_BeforeCellRender) event to change the column-header text. In the event handler, identify column-header elements using the `e-header-cell` class and update their displayed text value. The following code example shows how to change the text in the column headers. @@ -175,14 +175,14 @@ The following code example shows how to change the text in the column headers. {% endhighlight %} {% endtabs %} -## Limitations of insert and delete +## Limitations of insert and delete operations -The following features have some limitations in Insert/Delete: +Insert and delete operations have the following limitations: -* Insert row/column between the formatting applied cells. -* Insert row/column between the data validation. -* Insert row/column between the conditional formatting applied cells. -* Insert/delete row/column between the filter applied cells. +* Inserting rows or columns within formatted ranges has limited support. +* Inserting rows or columns within data-validation ranges has limited support. +* Inserting rows or columns within conditionally formatted ranges has limited support. +* Inserting or deleting rows or columns within filtered ranges has limited support. ## See Also diff --git a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/scrolling.md b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/scrolling.md index 2c846110b7..2376677d4f 100644 --- a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/scrolling.md +++ b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/scrolling.md @@ -10,46 +10,47 @@ documentation: ug # Scrolling in ASP.NET Core Spreadsheet control -Scrolling helps you to move quickly to different areas of the worksheet. It moves faster if we use horizontal and vertical scroll bars. Scrolling can be enabled by setting the [`allowScrolling`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_AllowScrolling) as true. +Scrolling allows you to navigate quickly to different areas of a worksheet using the horizontal and vertical scrollbars. Set the [`allowScrolling`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_AllowScrolling) property to `true` to enable scrolling in the Spreadsheet. -N> By default, the `allowScrolling` property is true. +N> The default value of the `allowScrolling` property is `true`. -You have the following options in Scrolling by using [`scrollSettings`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_ScrollSettings). +The following table lists the scrolling options available in [`scrollSettings`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_ScrollSettings): -* Finite scrolling. -* Virtual scrolling. +| Property | Type | Default value | Description | +|----------|------|---------------|-------------| +| `isFinite` | `boolean` | `false` | Specifies whether scrolling is restricted to the defined rows and columns. | +| `enableVirtualization` | `boolean` | `true` | Specifies whether rows and columns are rendered dynamically based on the viewport. | -## Finite Scrolling +## Scroll through a worksheet -Finite scrolling supports two type of modes in scrolling. You can use the `isFinite` property in [`scrollSettings`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_ScrollSettings) to specify the mode of scrolling. +You can scroll through a worksheet in one of the following ways: -* Finite - This mode does not create a new row/column when the scrollbar reaches the end. This can be achieved by setting the `isFinite` property as `true`. +* Use the arrow keys. +* Use the horizontal and vertical scrollbars. +* Use the mouse wheel. -* Infinite - This mode creates a new row/column when the scrollbar reaches the end. This can be achieved by setting the `isFinite`property as `false`. +## Finite Scrolling -N> By Default, the `isFinite` property is `false`. +The `isFinite` property in [`scrollSettings`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_ScrollSettings) supports the following scrolling modes: -## Virtual Scrolling +* **Finite mode**: Set `isFinite` to `true` to restrict scrolling to the defined rows and columns. +* **Infinite mode**: Set `isFinite` to `false` to allow scrolling beyond the initially defined rows and columns. -* Virtual scrolling allows you to load data that you require (load data based on viewport size) without buffering the entire huge database. You can set the `enableVirtualization` property in `scrollSettings` as `true`. +N> The default value of the `isFinite` property is `false`. -In virtual scrolling `enableVirtualization` is set to true means, it allows you to load the spreadsheet data while scrolling. - -N> By Default, the `enableVirtualization` property is `true`. +## Virtual Scrolling -**User Interface**: +Virtual scrolling renders rows and columns dynamically based on the viewport instead of rendering the entire dataset at once. Set the `enableVirtualization` property in `scrollSettings` to `true` to enable virtual scrolling. -You can scroll through the worksheet using one of the following ways, +When virtualization is enabled, the Spreadsheet loads and renders additional data while scrolling. -* Using the `arrow` keys. -* Using the Horizontal and Vertical`scroll` bars. -* Using the `mouse` wheel. +N> The default value of the `enableVirtualization` property is `true`. ## Finite scrolling with defined rows and columns -If you want to perform scrolling with defined rows and columns, you must define `rowCount` and `colCount` in the [`sheets`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_Sheets) property and set `isFinite` as true and `enableVirtualization` as false in `scrollSettings`. +To restrict scrolling to a defined number of rows and columns, set `rowCount` and `colCount` in the [`sheets`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_Sheets) property. Set `isFinite` to `true` and `enableVirtualization` to `false` in `scrollSettings`. -The following code example shows the finite scrolling with defined rows and columns in the spreadsheet. Here, we used rowCount as 20 and colCount as 20, after reaching the 20th row or 20th column you can't able to scroll. +The following code example demonstrates finite scrolling with defined rows and columns. The `rowCount` and `colCount` properties are set to `20`, so you cannot scroll beyond the 20th row or column. {% tabs %} {% highlight cshtml tabtitle="CSHTML" %} diff --git a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/searching.md b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/searching.md index 96ddb05baa..9063ca2e85 100644 --- a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/searching.md +++ b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/searching.md @@ -16,52 +16,55 @@ N> * The default value for `allowFindAndReplace` property is `true`. ## Find -Find feature is used to select the matched contents of a cell within the sheet or workbook. It is extremely useful when working with large set of data source. +The Find feature selects cells containing content that matches the search value within the current worksheet or workbook. It is useful when working with large data sources. -**User Interface**: +To find a value: -Find can be done by any of the following ways: +1. Select the **Search** icon in the Ribbon or press `Ctrl + F` to open the Find dialog. +2. Enter the value to search for. +3. Select **Find Next** or **Find Previous** to navigate between matching cells. +4. Open the additional search options to configure the search scope, direction, case sensitivity, or exact-cell matching. -* Select the Search icon in the Ribbon toolbar or use `Ctrl + F` key to open the Find dialog. -* Use find Next and find Previous buttons to search the given value in the workbook. -* Select the option button in Find dialog to open the Find and Replace dialog. Then, select the below properties for enhanced searching. - -N> * `Search within`: To search the target in a sheet (default) or in an entire workbook. -
* `Search by`: It enhance the search, either By Rows (default), or By Columns. -
* `Match case`: To find the matched value with case sensitive. -
* `Match exact cell contents`: To find the exact matched cell value with entire match cases. +You can also use the `find()` method to perform the find operation programmatically. +N> The Find dialog provides the following options: +
* `Search within`: Searches within the current worksheet or the entire workbook. The default scope is the current worksheet. +
* `Search by`: Searches by rows or columns. The default direction is by rows. +
* `Match case`: Finds values that match the capitalization of the search value. +
* `Match exact cell contents`: Finds cells whose complete content exactly matches the search value. * Using `find()` method to perform find operation. ## Replace -Replace feature is used to change the find contents of a cell within sheet or workbook. Replace All is used to change all the matched contents of a cell within sheet or workbook. +The Replace feature changes matching cell content within the current worksheet or workbook. The **Replace All** option changes all matching cells within the selected search scope. -**User Interface**: +To replace a value: -Replace can be done by any of the following ways: +1. Press `Ctrl + H` to open the Find and Replace dialog. +2. Enter the value to find and the replacement value. +3. Select **Replace** to replace the current match. +4. Select **Replace All** to replace all matching cells within the selected worksheet or workbook scope. -* Use `Ctrl + H` key to open the Find and Replace dialog. -* Use Replace button to change the found value in sheet or workbook. -* Using Replace All button, all the matched criteria can be replaced with find value based on sheet or workbook. -* Using `replace()` method to perform replace operation by passing the argument `args.replaceby` as `replace`. -* Using `replace()` method to perform replace all operation by passing the argument `args.replaceby` as `replaceall`. +You can also use the `replace()` method to perform Replace and Replace All operations programmatically. ## Go to -Go to feature is used to navigate to a specific cell address in the sheet or workbook. +The Go To feature navigates to a specified cell address in a worksheet. + +To navigate to a cell: -**User Interface**: +1. Press `Ctrl + G` to open the **Go To** dialog. +2. Enter the required cell address. +3. Confirm the operation to navigate to the specified cell. -* Use `Ctrl + G` key to open the Go To dialog. -* Use `goTo()` method to perform Go To operation. +You can also use the `goTo()` method to navigate to a cell programmatically. -In the following sample, searching can be done by following ways: +The following example demonstrates how to find values in the Spreadsheet: -* Select the Home tab in the Ribbon toolbar, and then select the Search icon. -* Enter any value in the search textbox. -* Select the next (or) previous button to find the entered value in the spreadsheet. -* You can have more options to find values by selecting the more options in the search toolbar. +1. Open the **Home** tab in the Ribbon and select the **Search** icon. +2. Enter a value in the search box. +3. Select **Next** or **Previous** to navigate between matching cells. +4. Open the additional search options to customize the search. {% tabs %} {% highlight cshtml tabtitle="CSHTML" %} diff --git a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/selection.md b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/selection.md index 47fe6e1115..bbd9ce1cb6 100644 --- a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/selection.md +++ b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/selection.md @@ -10,11 +10,19 @@ documentation: ug # Selection in ASP.NET Core Spreadsheet Control -Selection provides interactive support to highlight the cell, row, or column that you select. Selection can be done through Mouse, Touch, or Keyboard interaction. To enable selection, set `mode` as `Single` or `Multiple` in [`selectionSettings`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_SelectionSettings). If you set `mode` to `None`, it disables the UI selection. +Selection highlights the cell, row, or column you select. You can perform selection using mouse, touch, or keyboard interactions. To enable selection, set the `mode` property in [`selectionSettings`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_SelectionSettings) to `Single` or `Multiple`. Set it to `None` to disable UI selection. -N> The default value for `mode` in `selectionSettings` is `Multiple`. +The following table lists the available selection modes: -You have the following options in Selection, +| Mode | Description | +|------|-------------| +| `Single` | Allows only one cell to be selected at a time. | +| `Multiple` | Allows multiple cells, rows, columns, or ranges to be selected. | +| `None` | Disables selection through the user interface. | + +N> The default value of the `mode` property in `selectionSettings` is `Multiple`. + +The Spreadsheet supports the following types of selection: * Cell selection * Row selection @@ -22,30 +30,28 @@ You have the following options in Selection, ## Cell selection -Cell selection is used to select a single or multiple cells. It can be performed using the `selectRange` method. +Cell selection allows you to select one or more cells. Use the `selectRange()` method to select a cell or range programmatically. -**User Interface**: +You can select cells through the user interface in the following ways: -* Click on a cell to select it (or) use the `arrow` keys to navigate to it and select it. -* To select a range, select a cell, then use the left mouse button to select and drag over to other cells (or) use the `Shift + arrow` keys to select the range. -* To select non-adjacent cells and cell ranges, hold `Ctrl` and select the cells. +* Click a cell or use the arrow keys to navigate to it. +* To select a range, click a cell and drag across the required cells. Alternatively, hold `Shift` and use the arrow keys. +* To select non-adjacent cells or ranges, hold `Ctrl` and click the required cells. -You can quickly locate and select specific cells or ranges by entering their names or cell references in the Name box, which is located to the left of the formula bar, and also select named or unnamed cells or ranges by using the Go To (`Ctrl+G`) command. +You can also enter a cell reference or range name in the **Name box**, located to the left of the formula bar. Alternatively, press `Ctrl + G` to open the **Go To** dialog and navigate to a named or unnamed cell range. ## Row selection -Row selection is used to select a single or multiple rows. - -**User Interface**: +Row selection allows you to select one or more rows. -You can perform row selection in any of the following ways, +You can select rows through the user interface in the following ways: -* By clicking the row header. -* To select multiple rows, select a row header with the left mouse button and drag over to other row headers (or) use the `Shift + arrow` keys to select multiple rows. -* To select non-adjacent rows, hold `Ctrl` and select the row header. -* You can also use the `selectRange` method for row selection. +* Click a row header to select the row. +* To select multiple adjacent rows, click a row header and drag across the required row headers. Alternatively, hold `Shift` and use the arrow keys. +* To select non-adjacent rows, hold `Ctrl` and click the required row headers. +* Use the `selectRange()` method to select rows programmatically. -The following sample shows the row selection in the spreadsheet, here selecting the 5th row using the `selectRange` method. +The following example demonstrates how to select the fifth row using the `selectRange` method. {% tabs %} {% highlight cshtml tabtitle="CSHTML" %} @@ -60,18 +66,16 @@ The following sample shows the row selection in the spreadsheet, here selecting ## Column selection -Column selection is used to select a single or multiple columns. +Column selection allows you to select one or more columns. -**User Interface**: +You can select columns through the user interface in the following ways: -You can perform column selection in any of the following ways, +* Click a column header to select the column. +* To select multiple adjacent columns, click a column header and drag across the required column headers. Alternatively, hold `Shift` and use the arrow keys. +* To select non-adjacent columns, hold `Ctrl` and click the required column headers. +* Use the `selectRange()` method to select columns programmatically. -* By clicking the column header. -* To select multiple columns, select a column header with the left mouse button and drag over to other column headers (or) use the `Shift + arrow` keys to select the multiple columns. -* To select non-adjacent columns, hold `Ctrl` and select the column header. -* You can also use the `selectRange` method for row selection. - -The following sample shows the column selection in the spreadsheet, here selecting the 3rd column using the `selectRange` method. +The following example demonstrates how to select the third column using the `selectRange` method. {% tabs %} {% highlight cshtml tabtitle="CSHTML" %} @@ -86,7 +90,7 @@ The following sample shows the column selection in the spreadsheet, here selecti You can select single or multiple cells, rows, or columns using mouse and keyboard interactions. You can also programmatically perform selections using the [selectRange](https://helpej2.syncfusion.com/documentation/api/spreadsheet#selectrange) method. This selection behavior is controlled by the [selectionSettings](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_SelectionSettings) property. Finally, you can retrieve the selected cell values as a collection using the [getData](https://helpej2.syncfusion.com/documentation/api/spreadsheet#getdata) method. -Below is a code example demonstrating how to retrieve the selected cell values as a collection programmatically: +The following example demonstrates how to retrieve the values from the selected cells as a collection programmatically: {% tabs %} {% highlight cshtml tabtitle="CSHTML" %} @@ -97,9 +101,11 @@ Below is a code example demonstrating how to retrieve the selected cell values a {% endhighlight %} {% endtabs %} -## Remove Selection +## Disable Selection + +Set the `mode` property in [`selectionSettings`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_SelectionSettings) to `None` to disable selection through the user interface. -The following sample shows, how to remove the selection in the spreadsheet. Here changing the `mode` as `None` in [`selectionSettings`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_SelectionSettings) to disable's the UI selection. +The following example demonstrates how to disable UI selection in the Spreadsheet. {% tabs %} {% highlight cshtml tabtitle="CSHTML" %} @@ -114,4 +120,4 @@ The following sample shows, how to remove the selection in the spreadsheet. Here ## Limitations -* We have a limitation while performing the Select All(`ctrl + A`). You can do this only by clicking the Select All button at the top left corner. \ No newline at end of file +* Selecting all cells using `Ctrl + A` is not supported. Use the **Select All** button in the top-left corner of the worksheet instead. \ No newline at end of file diff --git a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/sort.md b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/sort.md index b548cb172f..89c6f456a7 100644 --- a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/sort.md +++ b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/sort.md @@ -10,26 +10,27 @@ documentation: ug # Sorting in ASP.NET Core Spreadsheet control -Sorting helps arranging the data to a specific order in a selected range of cells. You can use the [`allowSorting`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_AllowSorting) property to enable or disable sorting functionality. +Sorting helps arrange data in a specific order within a selected range of cells. Use the [`allowSorting`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_AllowSorting) property to enable or disable sorting functionality. -N> * The default value for `allowSorting` property is `true`. +N> * The default value of the `allowSorting` property is `true`. -By default, the `sort` module is injected internally into Spreadsheet to perform sorting. +By default, the `sort` module is injected internally into the Spreadsheet to provide sorting functionality. ## Sort by cell value -In the active Spreadsheet, select a range of cells to sort by cell value. The range sort can be done by any of the following ways: -* Select the sort item in the Ribbon toolbar and choose the ascending or descending item. -* Right-click the sheet, select the sort item in the context menu and choose the ascending/descending item. -* Use the `sort()` method programmatically. +To sort a selected range by cell value: -The cell values can be sorted in the following orders: -* Ascending -* Descending +* Select the range of cells to sort. +* Choose the required sorting option in one of the following ways: + * Open the sorting options in the Ribbon and choose **Ascending** or **Descending**. + * Right-click the selected range, open the sorting options in the context menu, and choose **Ascending** or **Descending**. -N> * Ascending is the default order for sorting. -The `sort()` method with empty arguments will sort the selected range by active cell’s column as sort column in ascending order. +You can also use the `sort()` method to sort a range programmatically. + +N> * Ascending is the default sorting order. + +When the `sort()` method is called without arguments, it sorts the selected range in ascending order using the active cell's column as the sort column. N> * The `beforeSort` event will be triggered before sorting the specified range.
* The `sortComplete` event will be triggered after the sort action is completed successfully. @@ -70,7 +71,7 @@ The default sort functionality of Spreadsheet is a case insensitive sorting. Whe Case sensitive sorting is applicable only for cells with alphabets. In ascending order sorting with case sensitive enabled, the cells with lower case text will be placed above the cells with upper case text. -N> * The default value for the `caseSensitive` property is `false`. +N> The default value of the `caseSensitive` property is `false`. You can also enable or disable this property using `beforeSort` event arguments, @@ -86,7 +87,7 @@ In the custom sort dialog, the `Case sensitive` checkbox is unchecked on load as ## Sort multiple columns -When you want to perform sorting on multiple columns, it can be done by any of the following ways: +You can sort multiple columns in one of the following ways: * Select the `Custom sort…` menu item from the Ribbon toolbar item or context menu item. * Use the `sort()` method programmatically by providing sort criteria. @@ -94,7 +95,7 @@ N> * The current sorting functionality supports sorting based on cell values onl ### Custom sort dialog -The custom sort dialog helps sorting multiple columns in the selected range by utilizing the rich UI. This dialog will be appeared while choosing the `Custom sort…` from the Ribbon item or context menu item. By default, sort criteria with the first column name from the selected range will be appeared in the dialog on initial load and it cannot be removed. +The custom sort dialog allows you to sort multiple columns in the selected range. The dialog appears when you select **Custom Sort** from the Ribbon or context menu. By default, the first column in the selected range is added as a sort criterion and cannot be removed. Use **Add Column** to add criteria with different sort orders. To remove an added criterion, select its delete icon. You can add multiple criteria using the `Add Column` button at the bottom of the dialog. Thus, multiple columns can be specified with different sort order. The newly added sort criteria items can be removed using the `delete` icons at the end of each items. @@ -146,9 +147,9 @@ In the following demo, the `Trustworthiness` column is sorted based on the custo {% endhighlight %} {% endtabs %} -## Known error validations +## Sorting validation errors -The following errors have been handled for sorting, +The Spreadsheet handles the following sorting validation errors: * *Out of range validation:* When the selected range is not a used range of the active sheet, it is considered as invalid and the out of range alert with the message `Select a cell or range inside the used range and try again` will be displayed. No sort will be performed if the range is invalid. * *Empty field validation:* When the sort criteria does not have a column selected (empty) in the custom sort dialog, it will become invalid, and an error message `Sort criteria column should not be empty` will be displayed on `OK` button click. @@ -157,7 +158,7 @@ The following errors have been handled for sorting, ## Limitations -* Sorting is not supported with formula contained cells. +* Sorting cells that contain formulas is not supported. ## See Also diff --git a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/suspend-resume.md b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/suspend-resume.md index 0ad385a71c..3542dfe475 100644 --- a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/suspend-resume.md +++ b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/suspend-resume.md @@ -9,7 +9,7 @@ documentation: ug # Suspend and Resume UI Refresh in ASP.NET Core Spreadsheet -The Spreadsheet refreshes its UI after each operation performed through public methods, such as updating a cell, applying formatting, or inserting rows. This immediate rendering works well for a few actions, but it can lead to performance issues when many operations are executed one after another. +The Spreadsheet refreshes its UI after each public method call, such as updating a cell, applying formatting, or inserting rows. Immediate rendering works well for a few actions but can cause performance issues when many operations are performed in sequence. The **suspend and resume refresh** feature lets you temporarily pause UI rendering, perform multiple operations, and then refresh the UI only once at the end. This helps reduce unnecessary re-rendering and improves the overall performance of bulk updates. @@ -17,7 +17,7 @@ This is especially useful when the Spreadsheet is updated programmatically durin ## When to use -Use this feature when you need to perform several actions in sequence, such as: +Use this feature when performing several operations in sequence, such as: - Updating many cells at once - Applying formatting to a large range @@ -25,14 +25,14 @@ Use this feature when you need to perform several actions in sequence, such as: - Running repeated operations inside a loop - Working with large datasets -For a few operations, this feature is usually not required. +This feature is generally not required for a few simple operations. ## How to use Use the following methods: -- `suspendRefresh` — pauses UI rendering -- `resumeRefresh` — applies all pending visual updates +- [`suspendRefresh`](https://ej2.syncfusion.com/documentation/api/spreadsheet/index-default#suspendrefresh) — Pauses UI refresh while allowing the required Spreadsheet operations to run. +- [`resumeRefresh`](https://ej2.syncfusion.com/documentation/api/spreadsheet/index-default#resumerefresh) — Resumes UI refresh and renders the pending visual changes. ### Step 1: Suspend UI refresh @@ -74,8 +74,9 @@ Call `resumeRefresh` after all operations are complete. The Spreadsheet then ren spreadsheet.setColumnsWidth(90, ['B:K']); spreadsheet.resumeRefresh(); } - ``` +> Always pair each `suspendRefresh` call with a corresponding `resumeRefresh` call. If `resumeRefresh` is not called, the pending UI changes may not be rendered. ## API reference diff --git a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/template.md b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/template.md index f56af11fb9..77ce4491fc 100644 --- a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/template.md +++ b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/template.md @@ -10,7 +10,13 @@ documentation: ug # Cell Template in ASP.NET Core Spreadsheet Control -Cell Template is used for adding HTML elements into Spreadsheet. You can add the cell template in spreadsheet by using the `template` property and specify the address using the `address` property inside the `ranges` property. You can customize the HTML elements similar to Syncfusion® components (TextBox, DropDownList, RadioButton, MultiSelect, DatePicker etc) by using the `beforeCellRender` event. In this demo, Cell template is applied to `C2:C9` and instantiated with HTML input components like TextBox, RadioButton, TextArea. You need to bind the events to perform any operations through HTML elements or Syncfusion® components. Here, we have added `change` event in to the MultiSelect control, and we have updated the selected data into the spreadsheet cell through that change event. +Cell Template allows you to add HTML elements to the Spreadsheet. Use the `template` property to define a cell template and the `address` property within `ranges` to specify where the template is applied. + +Use the `beforeCellRender` event to further customize the HTML elements or initialize Syncfusion components within templated cells. You can initialize components such as TextBox, DropDownList, RadioButton, MultiSelect, DatePicker, and TextArea. + +In the following example, a cell template is applied to the `C2:C9` range. Bind events to perform operations through the HTML elements or Syncfusion components. The MultiSelect `change` event writes the selected value to the corresponding Spreadsheet cell. + +The following code example demonstrates how to apply a cell template, initialize components in the templated cells, and handle component events. The following code example describes the above behavior. diff --git a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/undo-redo.md b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/undo-redo.md index 6a3c2b31b4..00fd1298cc 100644 --- a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/undo-redo.md +++ b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/undo-redo.md @@ -10,31 +10,31 @@ documentation: ug # Undo and Redo in ASP.NET Core Spreadsheet control -`Undo` option helps you to undone the last action performed and `Redo` option helps you to do the same action which is reverted in the Spreadsheet. You can use the [`allowUndoRedo`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_AllowUndoRedo) property to enable or disable undo redo functionality in spreadsheet. +The `Undo` option reverses the last action performed in the Spreadsheet. The `Redo` option reapplies the most recently undone action. Use the [`allowUndoRedo`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Spreadsheet.Spreadsheet.html#Syncfusion_EJ2_Spreadsheet_Spreadsheet_AllowUndoRedo) property to enable or disable undo and redo functionality in the Spreadsheet. -N> * The default value for `allowUndoRedo` property is `true`. +N> * The default value of the `allowUndoRedo` property is `true`. -By default, the `UndoRedo` module is injected internally into Spreadsheet to perform undo redo. +By default, the `UndoRedo` module is injected internally into the Spreadsheet to perform Undo and Redo operations. ## Undo -It reverses the last action you performed with Spreadsheet. Undo can be done by any of the following ways: +Undo reverses the last action performed in the Spreadsheet. You can perform an undo operation in one of the following ways: -* Select the undo item from HOME tab in Ribbon toolbar. -* Use `Ctrl + Z` keyboard shortcut to perform the undo. -* Use the `undo` method programmatically. +* Open the **Home** tab in the Ribbon and choose **Undo**. +* Press `Ctrl + Z`. +* Use the `undo()` method programmatically. ## Redo -It reverses the last undo action you performed with Spreadsheet. Redo can be done by any of the following ways: +Redo reapplies the action that was most recently undone in the Spreadsheet. You can perform a Redo operation in one of the following ways: -* Select the redo item from HOME tab in Ribbon toolbar. -* Use `Ctrl + Y` keyboard shortcut to perform the redo. -* Use the `redo` method programmatically. +* Open the **Home** tab in the Ribbon and choose **Redo**. +* Press `Ctrl + Y`. +* Use the `redo()` method programmatically. -## Update custom actions in UndoRedo collection +## Update custom actions in the UndoRedo collection -You can update your own custom actions in UndoRedo collection, by using the `updateUndoRedoCollection` method. And also customize the undo redo operations of your custom action by using `actionComplete` event. +Use the `updateUndoRedoCollection()` method to add or update custom actions in the `UndoRedo` collection. Use the `actionComplete` event to customize the Undo and Redo behavior of those actions. The following code example shows `How to update and customize your own actions for undo redo` functionality in the Spreadsheet control. diff --git a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/worksheet.md b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/worksheet.md index bdfd0b6ea3..7eabdd38dd 100644 --- a/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/worksheet.md +++ b/Document-Processing/Excel/Spreadsheet/ASP-NET-CORE/worksheet.md @@ -10,17 +10,17 @@ documentation: ug # Worksheet in ASP.NET Core Spreadsheet control -Worksheet is a collection of cells organized in the form of rows and columns that allows you to store, format, and manipulate the data. +A worksheet is a collection of cells organized into rows and columns that allows you to store, format, and manipulate data. ## Add sheet -You can dynamically add or insert a sheet by one of the following ways, +You can add or insert a worksheet in one of the following ways: -* Click the `Add Sheet` button in the sheet tab. This will add a new empty sheet next to current active sheet. -* Right-click on the sheet tab, and then select `Insert` option from the context menu to insert a new empty sheet before the current active sheet. -* Using `insertSheet`method, you can insert one or more sheets at your desired index. +* Select **Add Sheet** on the sheet tab bar to add an empty worksheet next to the active worksheet. +* Right-click a sheet tab and choose **Insert** from the context menu to insert an empty worksheet before the active worksheet. +* Use the `insertSheet()` method to insert one or more worksheets at a specified index. -The following code example shows the insert sheet operation in spreadsheet. +The following code example demonstrates how to insert a worksheet in the Spreadsheet. {% tabs %} {% highlight cshtml tabtitle="CSHTML" %} @@ -31,9 +31,9 @@ The following code example shows the insert sheet operation in spreadsheet. {% endhighlight %} {% endtabs %} -### Insert a sheet programmatically and make it active sheet +### Insert a sheet programmatically and make it active -A sheet is a collection of cells organized in the form of rows and columns that allows you to store, format, and manipulate the data. Using `insertSheet` method, you can insert one or more sheets at the desired index. Then, you can make the inserted sheet as active sheet by focusing the start cell of that sheet using the `goTo` method. +Use the `insertSheet()` method to insert one or more worksheets at the required index. After inserting a sheet, use the `goTo()` method to focus its first cell and make it the active worksheet. The following code example shows how to insert a sheet programmatically and make it the active sheet. @@ -49,16 +49,14 @@ The following code example shows how to insert a sheet programmatically and make ## Delete sheet -The Spreadsheet has support for removing an existing worksheet. You can dynamically delete the existing sheet by the following way, +You can delete an existing worksheet in one of the following ways: -* Right-click on the sheet tab, and then select `Delete` option from context menu. -* Using `delete` method to delete the sheets. +* Right-click the sheet tab and choose **Delete** from the context menu. +* Use the `delete` method to remove a worksheet programmatically. ## Rename sheet -You can dynamically rename an existing worksheet in the following way, - -* Right-click on the sheet tab, and then select `Rename` option from the context menu. +* To rename a worksheet, right-click its sheet tab and choose **Rename** from the context menu. ## Headers @@ -67,13 +65,17 @@ By default, the row and column headers are visible in worksheets. You can dynami * Switch to `View` tab, and then select `Hide Headers` option to hide both the row and column headers. * Set `showHeaders` property in `sheets` as `true` or `false` to show or hide the headers at initial load. By default, the `showHeaders` property is enabled in each worksheet. +N> The default value of the `showHeaders` property is `true`. + ## Gridlines -Gridlines act as a border like appearance of cells. They are used to distinguish cells on the worksheet. You can dynamically show or hide gridlines by using one of the following ways, +Gridlines are visual separators that help distinguish cells in a worksheet.You can show or hide gridlines in one of the following ways: * Switch to `View` tab, and then select `Hide Gridlines` option to hide the gridlines in worksheet. * Set `showGridLines` property in `sheets` as `true` or `false` to show or hide the gridlines at initial load. By default, the `showGridLines` property is enabled in each worksheet. +N> The default value of the `showGridLines` property is `true`. + The following code example shows the headers and gridlines operation in spreadsheet. {% tabs %} @@ -87,17 +89,15 @@ The following code example shows the headers and gridlines operation in spreadsh ## Sheet visibility -Hiding a worksheet can help prevent unauthorized or accidental changes to your file. +Hiding a worksheet can help prevent unauthorized or accidental changes to the Spreadsheet. There are three visibility state as like Microsoft Excel, | State | Description | -|-------|---------| -| `Visible` | You can see the worksheet once the component is loaded. | -| `Hidden` | This worksheet is not visible, but you can unhide by selecting the sheet from `List All Sheets` -dropdown menu. | -| `VeryHidden` | This worksheet is not visible and cannot be unhidden. Changing the -state property to `Visible` is the only way to view this sheet. | +|-------|-------------| +| `Visible` | The worksheet is visible when the Spreadsheet is loaded. | +| `Hidden` | The worksheet is hidden but can be displayed by selecting it from the **List All Sheets** drop-down menu. | +| `VeryHidden` | The worksheet is hidden and cannot be displayed through the user interface. Set its `state` property to `Visible` to display it. | The following code example shows the three types of sheet visibility state.