diff --git a/blazor/spreadsheet/cell-range.md b/blazor/spreadsheet/cell-range.md index e792845d37..eaaa6f87c3 100644 --- a/blazor/spreadsheet/cell-range.md +++ b/blazor/spreadsheet/cell-range.md @@ -9,78 +9,83 @@ documentation: ug # Managing Cell Ranges in Blazor Spreadsheet component -A cell range refers to a group of selected cells in a Spreadsheet that can be manipulated or processed collectively. +A cell range in the Blazor Spreadsheet component refers to a group of selected cells that can be manipulated or processed collectively. It enables efficient data handling by allowing users to apply formatting, perform autofill operations, and clear content across multiple cells at once. This functionality streamlines spreadsheet workflows and enhances data presentation within the application. ## Cell formatting -Cell formatting enhances the visual presentation of data in a Spreadsheet by applying styles such as font changes, colors, borders, and alignment to individual cells or cell ranges. This helps in organizing and emphasizing important information effectively. +Cell formatting enhances the visual presentation of data in the Spreadsheet component by applying styles to individual cells or cell ranges. Supported styles include font modifications, colors, borders, and alignment, which help organize and emphasize important information effectively. These formatting options improve readability, establish visual hierarchy, and highlight key data points for better clarity and impact. -Cell formatting options include: +N> To enable formatting in a protected sheet, select the **Format cells** checkbox in the protection settings. For more details, refer [here](https://blazor.syncfusion.com/documentation/spreadsheet/protection#protection-settings-in-a-protected-sheet). -* **Bold** - Applies a heavier font weight to make the text stand out in the Spreadsheet. +### Available formatting options -* **Italic** - Slants the text to give it a distinct look, often used for emphasis or to highlight differences. +Formatting options in the Spreadsheet component include several stylistic and positional attributes, each serving a specific purpose in data presentation. These options are accessible through the **Ribbon** under the **Home** tab. -* **Underline** - Adds a line below the text, commonly used for emphasis or to indicate hyperlinks. +| **Formatting Option** | **Description** | +|---------------------------|-----------------| +| **Bold** | Applies a heavier font weight to make text more prominent. Commonly used for headers or key values. | +| **Italic** | Slants text to distinguish or emphasize specific entries within a cell range. | +| **Underline** | Adds a line beneath text, often used to denote hyperlinks or draw attention to important content. | +| **Strikethrough** | Places a horizontal line through text, typically used to indicate completed tasks or obsolete data. | +| **Font Family** | Changes the typeface (e.g., Arial, Calibri, Times New Roman) to improve readability or match design preferences. | +| **Font Size** | Modifies text size to establish hierarchy or enhance legibility—larger for headings, smaller for detailed entries. | +| **Font Color** | Alters text color to organize information visually or apply color-coded categorization for clarity. | +| **Fill Color** | Applies background color to cells, helping group related data or highlight key areas. | +| **Horizontal Alignment** | Adjusts left-to-right positioning of content:
• **Left** – Ideal for text
• **Center** – Common for titles
• **Right** – Suited for numbers | +| **Vertical Alignment** | Controls top-to-bottom placement within a cell:
• **Top** – Useful for multiline text
• **Middle** – Balanced presentation
• **Bottom** – Default setting | +| **Wrap Text** | Displays lengthy content across multiple lines within a cell, preventing overflow and maintaining layout integrity. | -* **Strikethrough** - Draws a line through the text, often used to show completed tasks or outdated information. - -* **Font Family** - Changes the typeface of the text (e.g., Arial, Calibri, Times New Roman, and more) to enhance readability or visual appeal. +## Autofill -* **Font Size** - Adjusts the size of the text to create visual hierarchy or improve readability in the Spreadsheet. +The **Autofill** feature in the Spreadsheet component allows cells to be populated based on patterns detected from adjacent cells. This functionality reduces manual data entry and enhances efficiency. It is controlled by the [`AllowAutofill`](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Spreadsheet.SfSpreadsheet.html#Syncfusion_Blazor_Spreadsheet_SfSpreadsheet_AllowAutofill) property, which is set to **true** by default. -* **Font Color** - Changes the color of the text to improve visual hierarchy or to organize information using color codes. +The Autofill can be performed in two ways: +- Through the user interface (UI) by dragging the fill handle +- Programmatically using the [`AutofillAsync`](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Spreadsheet.SfSpreadsheet.html#Syncfusion_Blazor_Spreadsheet_SfSpreadsheet_AutofillAsync_System_String_System_String_System_String_) method -* **Fill Color** - Adds color to the cell background to visually organize data or highlight important information. +The Autofill feature supports: +- Copying cell values +- Detecting formula patterns -* **Horizontal Alignment** - Controls the position of text from left to right within a cell. Options include: - * **Left** - Default for text - * **Center** - Useful for headings - * **Right** - Default for numbers +> * When the `AllowAutofill` property is set to **false**, the fill handle is not displayed in the UI, and programmatic autofill operations using the `AutofillAsync` method does not execute. +> * When a sheet is protected, autofill is applicable only to unlocked ranges. This applies to autofill operations performed through the UI as well as those executed programmatically. To know more about worksheet protection, refer [here](https://blazor.syncfusion.com/documentation/spreadsheet/protection#protect-sheet). -* **Vertical Alignment** - Controls the position of text from top to bottom within a cell. Options include: - * **Top** – Aligns content to the top of the cell - * **Middle** – Centers content vertically - * **Bottom** – Default alignment +### Autofill via UI -* **Wrap Text** - Displays long content on multiple lines within a single cell, preventing it from overflowing into adjacent cells. +Autofill can be performed in the UI by dragging the fill handle, a small square at the bottom-right corner of a selected cell or range, which serves as the control point for initiating autofill operations. The following steps outline the process: -Cell formatting can be applied to or removed from a cell or range of cells by using the formatting options available in the Ribbon toolbar under the **Home** tab. +* Select a cell or range containing the data to be used as the source for autofill. -## Autofill +* Position the cursor over the fill handle until it changes to a crosshair, a plus-shaped pointer. This indicates that the fill handle is ready to be dragged. -Autofill is used to fill cells with data based on adjacent cells. It follows patterns from adjacent cells when available, eliminating the need to enter repeated data manually. The [AllowAutofill](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Spreadsheet.SfSpreadsheet.html#Syncfusion_Blazor_Spreadsheet_SfSpreadsheet_AllowAutofill) property can be used to enable or disable the autofill support. +* Drag the fill handle in the required direction—up, down, left, or right—to populate the target range with data based on the source pattern. -> * The default value of the `AllowAutofill` property is **true**. +This process automatically detects and applies patterns for formula cells and repeated text values to the filled range. -Autofill can be performed in one of the following ways: +![Autofill](images/autofill.gif) -* Drag and drop the cell using the fill handle element. -* Use the [AutofillAsync()](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Spreadsheet.SfSpreadsheet.html#Syncfusion_Blazor_Spreadsheet_SfSpreadsheet_AutofillAsync_System_String_System_String_System_String_) method programmatically. +### Autofill programmatically -The available parameters in the `AutofillAsync()` method are: +Autofill can be performed programmatically using the `AutofillAsync` method, which supports specifying both the fill range and the source data range. The operation is skipped if invalid range addresses are provided. | Parameter | Type | Description | | -- | -- | -- | -| fillRange | string | Specifies the fill range. | -| dataRange | string | Specifies the data range. | -| direction | string | Specifies the direction ("Up", "Right", "Down", and "Left") to be filled. | - -### Implementing autofill programmatically +| fillRange | string | Specifies the address of the target range where the auto-fill operation will be applied. The value must be a valid cell range address (e.g., **"A1:A10"**) and must lie within the boundaries of the active worksheet. | +| dataRange | string (optional) | Specifies the address of the source data range in the active sheet used for filling. For example, **"A1"**. If this parameter is set to null, the currently active cell is used as the data source by default. | {% tabs %} {% highlight razor tabtitle="Index.razor" %} @using Syncfusion.Blazor.Spreadsheet - - + + @code { public byte[] DataSourceBytes { get; set; } - public SfSpreadsheet spreadsheetObj; + public SfSpreadsheet SpreadsheetInstance; protected override void OnInitialized() { @@ -88,37 +93,44 @@ The available parameters in the `AutofillAsync()` method are: DataSourceBytes = File.ReadAllBytes(filePath); } - public async Task AutofillRangeHandler() - { - // Basic usage with only the fill range parameter. - await spreadsheetObj.AutofillAsync("B7:B8"); + public async Task AutofillRange() + { + // Autofills the range A1:A10 downward using the value from cell A1. + await SpreadsheetInstance.AutofillAsync("A1:A10", "A1"); + + // Autofills the range B1:E1 rightward using the value from cell B1. + await SpreadsheetInstance.AutofillAsync("B1:E1", "B1"); + + // Autofills the range C1:C10 downward using the active cell as the data source. + await SpreadsheetInstance.AutofillAsync("C1:C10"); } } {% endhighlight %} {% endtabs %} -The following illustration demonstrates the use of autofill in the Spreadsheet component. +## Clear -![Autofill Illustration](images/autofill.gif) +The Spreadsheet component offers precise control over the removal of cell contents, formats, and hyperlinks. It provides four distinct clear options, each targeting specific elements within the selected cells or range: -## Clear +- **Clear All**: Removes all contents (formulas and data), formats (including number formats), and hyperlinks. +- **Clear Formats**: Removes only formatting elements such as number formats, fonts, and cell styles, while preserving contents and hyperlinks. +- **Clear Contents**: Removes only the contents, including formulas and data, while retaining formats and hyperlinks. +- **Clear Hyperlinks**: Removes only hyperlinks, leaving contents and formats intact. + +### Applying clear functionality -Clear support helps clear the cell contents (formulas and data) and formats (including number formats) in a Spreadsheet. When **Clear All** is applied, both the contents and the formats will be cleared simultaneously. +To use the clear options via the UI: -### Applying the clear functionality +1. Select the cell or range of cells. +2. Click the **Clear** icon in the **Home** tab of the **Ribbon**. +3. Choose the desired option: **Clear All**, **Clear Formats**, **Clear Contents**, or **Clear Hyperlinks**. -The clear support can be applied using the following way: +![Clear options in the Blazor Spreadsheet](images/clear-feature.png) -* Select the **Clear** icon in the Ribbon toolbar under the **Home** tab. +### Clear functionality in protected sheets -| Options | Uses | -| -- | -- | -| **Clear All** | Used to clear all contents, formats, and hyperlinks. | -| **Clear Formats** | Used to clear the formats (including number formats) in a cell. | -| **Clear Contents** | Used to clear the contents (formulas and data) in a cell. | -| **Clear Hyperlinks** | Used to clear the hyperlink in a cell. | +When a sheet is protected, restrictions apply to the clear functionality. The **Clear All** and **Clear Contents** options are available only for unlocked ranges. To enable **Clear Formats** for these ranges, the **Format Cells** checkbox must be selected in the sheet protection settings. Similarly, to enable **Clear Hyperlinks**, the **Insert Hyperlinks** checkbox must be selected. -The following image displays the clear options available in the Ribbon toolbar under the **Home** tab of the Blazor Spreadsheet. +N> To know more about worksheet protection settings, refer [here](https://blazor.syncfusion.com/documentation/spreadsheet/protection#protection-settings-in-a-protected-sheet). -![Clear options in the Blazor Spreadsheet](images/clear-feature.png) \ No newline at end of file diff --git a/blazor/spreadsheet/formulas.md b/blazor/spreadsheet/formulas.md index b3f30ff5c7..183584f867 100644 --- a/blazor/spreadsheet/formulas.md +++ b/blazor/spreadsheet/formulas.md @@ -9,99 +9,224 @@ documentation: ug # Formulas in Blazor Spreadsheet component -**Formulas** enable calculations within a worksheet by referencing cells from either the same worksheet or other worksheets in the workbook. +The Syncfusion Blazor Spreadsheet component offers robust formula support, enabling to perform complex calculations and data analysis with ease. These formulas operate on cell values by referencing data from the current sheet or across multiple sheets within the workbook. ## Formula Bar -The **Formula Bar** simplifies editing or entering cell data. The [ShowFormulaBar](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Spreadsheet.SfSpreadsheet.html#Syncfusion_Blazor_Spreadsheet_SfSpreadsheet_ShowFormulaBar) property is used to enable or disable the **Formula Bar**. The default value of the `ShowFormulaBar` property is **true**. +The formula bar is a key interface element in the Syncfusion Blazor Spreadsheet component, positioned at the top of the spreadsheet. It serves as a centralized space for viewing, editing, and entering cell content and formulas, promoting efficient data management and accurate formula input. -### Working with Formulas via the UI +The formula bar height can be expanded or collapsed as needed. Expanding the formula bar increases its vertical space, facilitating easier reading and editing of lengthy or complex formulas. -Formulas in the Syncfusion Blazor Spreadsheet can be accessed and inserted using the following methods: +Its visibility is controlled by the [`ShowFormulaBar`](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Spreadsheet.SfSpreadsheet.html#Syncfusion_Blazor_Spreadsheet_SfSpreadsheet_ShowFormulaBar) property, which is enabled by default (**true**), ensuring the formula bar appears automatically. If `ShowFormulaBar` is set to **false**, the formula bar is removed from the interface. -* Select **Insert Function** from the **Formulas** tab in the Ribbon toolbar. In the **Insert Function** dialog, choose a category, then select the desired function to insert it into the selected cell. +![Formula Bar](./images/formulabar.png) -![Insert Function Dialog](./images/insert-formula.gif) +## Working with formulas via UI -* Type **(=)** in a cell or the **Formula Bar** to display a list of available functions. Select a function from the list to insert it into the cell. +The Syncfusion Blazor Spreadsheet component offers multiple ways to insert and edit formulas, supporting different workflow preferences. Each method is designed for specific use cases and provides distinct advantages for creating and managing formulas efficiently. -![Formulas Intellisense](./images/formula-cell.gif) +### Insert function dialog -* Click the **Insert Function** button next to the **Formula Bar** to open the **Insert Function** dialog, which provides the same categorized function list and insertion options as the Ribbon toolbar. +The Syncfusion Blazor Spreadsheet component provides two ways to access the **Insert Function** dialog for adding formulas: -![Insert Function Button](./images/insert-function.gif) +- From the Ribbon: +Select **Insert Function** from the **Formulas** tab in the **Ribbon**. In the **Insert Function** dialog, choose a category, select a formula, and click the **OK** button to insert it into the selected cell. + +![Insert Function Ribbon](./images/insertfunction-ribbon.png) + +- From the Formula Bar: +Click the **Insert Function** button next to the **Name Box** to open the same dialog. This provides the same categorized formula list and insertion options as the **Ribbon**. + +![Insert Function Button](./images/insertfunction-button.png) + +![Insert Function Dialog](./images/insertfunction-dialog.png) + +### Effortless formula typing using IntelliSense + +Formulas can be entered directly into a cell or the **Formula Bar** by starting with an equals sign (**=**) followed by the formula expression. This action activates the **IntelliSense** feature, which displays a dropdown list of relevant functions and suggestions. +IntelliSense simplifies formula creation by offering quick access to available functions, reducing the need for manual typing, and helping prevent syntax errors. This makes formula entry faster, more accurate, and easier to manage. + +![Formula - Intellisense](./images/formula-intellisense.gif) + +### Using cell references in formulas + +When working with formulas that require cell references as arguments, the Spreadsheet component supports two primary interaction methods for streamlined formula creation. + +**Direct keyboard entry** + +Formulas and cell references can be entered manually using the keyboard. Begin by typing an equals sign **(=)**, followed by either a cell address, a function name, or an arithmetic expression involving cell references. + +*Referencing a single cell*: + +To reference the value in a specific cell, enter the cell address preceded by an equals sign. +Example: +**=A2** retrieves the value from cell A2. + +*Using functions with cell references*: + +To create a formula using a function, type the function name followed by an opening parenthesis, then enter the required cell addresses using standard format (for example, A1, B5, or C10). +Example: +**=SQRT(A1)** calculates the sum of the value in cell A1. + +For formulas involving multiple values, separate each cell reference with a comma. +Example: +**=SUM(A1,B1,C1)** adds the values from three individual cells. + +To refer to a range of cells, use a colon between the starting and ending cell addresses. +Example: +**=SUM(A1:A10)** adds values from all cells between A1 and A10. + +*Performing arithmetic operations with cell references*: + +Arithmetic operations can be performed directly using cell references. These expressions calculate results based on the values stored in the referenced cells. +Examples: +**=A1+B5** adds the values in cells **A1** and **B5**. +**=A1*A6** multiplies the values in cells **A1** and **A6**. +**=C3-D2** subtracts the value in cell **D2** from the value in cell **C3**. +**=E4/F2** divides the value in cell **E4** by the value in cell **F2**. + +This approach enables dynamic calculations that automatically update when the values in the referenced cells change. + +**Inserting cell references using interactive selection** + +The Spreadsheet component supports interactive methods for inserting both individual cell references and cell ranges into formulas. + +*Referencing individual cells*: + +To insert individual cell references into a formula, begin by typing a function name followed by an opening parenthesis. Then, click directly on a cell in the worksheet to insert its reference. For functions requiring multiple arguments, type a comma after each cell reference, then click another cell to add its reference. This sequence can be repeated as needed. To complete the formula, add a closing parenthesis and press **Enter**. + +**Example**: +Typing **=AVERAGE(** and clicking cells **F3**, **F5**, and **F7** in sequence—while inserting commas between selections—results in the formula: +**=AVERAGE(F3,F5,F7)** + +![Interactive cell selection](./images/interactive-cellselection.png) + +*Referencing a range of cells*: + +To reference a range of adjacent cells, begin by typing a function name followed by an opening parenthesis. Click the starting cell of the range, then hold the **Shift** key and click the ending cell. The component inserts the full range reference into the formula. + +**Example**: +Typing **=AVERAGE(**, clicking cell **F3**, then holding **Shift** and clicking cell **F6** results in the formula: +**=AVERAGE(F3:F6)** + +![Interactive range selection](./images/interactive-rangeselection.png) + +This approach simplifies formula creation and ensures accurate cell referencing for both individual and grouped data. + +N> When a sheet is protected, **Insert Function** option is disabled. For more information on worksheet protection, refer [here](https://blazor.syncfusion.com/documentation/spreadsheet/protection#protect-sheet). ## Calculation Mode -The Spreadsheet includes **Calculation Option** functionality, similar to Excel's calculation settings, which controls when and how formulas are recalculated. The available modes are: +The Syncfusion Blazor Spreadsheet component includes a **Calculation Option** feature that controls when and how formulas are recalculated. This functionality helps optimize performance and mirrors the behavior found in Microsoft Excel. + +**Available Modes** +- *Automatic*: +Formulas are recalculated immediately whenever a dependent cell value changes. This mode ensures real-time updates and is suitable for dynamic data entry. +When this mode is active, the **Calculate Sheet** and **Calculate Workbook** buttons are disabled, as recalculation occurs automatically. + +- *Manual*: +Formulas are recalculated only when explicitly triggered. This mode is useful for improving performance in large datasets or when frequent recalculations are not required. +In this mode, the **Calculate Sheet** and **Calculate Workbook** buttons are enabled, allowing manual control over recalculation. + +### Managing calculation mode via Ribbon +The **Ribbon** provides a user interface(UI) for managing formula calculation behavior. -* **Automatic**: Formulas recalculate instantly when any dependent cell changes. +- Select the **Formulas** tab from **Ribbon**. +- Click the **Calculation Option** dropdown. +- Choose either **Automatic** or **Manual** mode based on the desired behavior. -* **Manual**: Formulas recalculate only when explicitly triggered using the **Calculate Sheet** or **Calculate Workbook** options. +### Manual recalculation options +When **Manual** mode is selected, the following options become available in the Formulas tab: -### Automatic +**Calculate Sheet:** +Recalculates all formulas within the currently active worksheet. This is useful when changes are limited to a single sheet. -In **Automatic Mode**, formulas are recalculated instantly whenever a dependent cell is modified. This mode is ideal for scenarios requiring real-time updates, ensuring the most current results are displayed without manual intervention. +**Calculate Workbook:** +Recalculates formulas across all worksheets in the workbook. This ensures consistency when formulas span multiple sheets. -**Example:** +### Automatic mode behavior +In **Automatic** mode, formulas are recalculated instantly when any referenced cell value changes. This ensures that computed results remain accurate and up to date without requiring manual intervention. -If cell **C1** contains the formula **=A1 + B1**, and the value in **A1** or **B1** changes, **C1** will automatically update to reflect the new result. +**Example**: +If cell **C1** contains the formula **=A1+B1**, any change to **A1** or **B1** will automatically update the result in **C1**. -### Manual +### Manual mode behavior +In **Manual** mode, formulas do not update automatically. Recalculation must be triggered manually using the **Calculate Sheet** or **Calculate Workbook** options. -In **Manual Mode**, formulas are not recalculated automatically when cell values change. Instead, recalculations must be triggered manually. This mode is especially useful for improving performance when working with large datasets or complex formulas, where automatic updates might slow down the Spreadsheet. +**Example**: +If cell **C1** contains the formula **=A1+B1**, changes to **A1** or **B1** will not affect **C1** until a manual recalculation is performed. -**Example:** +![Manual calculation mode](./images/caculation-manual.gif) -If cell **C1** contains the formula **=A1 + B1**, and the value in **A1** or **B1** changes, **C1** will not update until a manual recalculation is performed. The Spreadsheet provides two options for manual recalculation: +## Named Range -**Calculate Sheet:** Recalculates formulas for the active sheet only. +The **Named Range** feature in the Syncfusion Blazor Spreadsheet component enables assignment of a descriptive name to a specific cell or range of cells. This improves Spreadsheet readability and functionality, facilitating easier navigation, maintenance, and comprehension—particularly when constructing formulas or performing data analysis. -**Calculate Workbook:** Recalculates formulas across all sheets in the workbook. +**Named range usage in formulas** -## Named Ranges +A named range is a label given to a group of cells. This label makes formulas easier to read and understand. +**Example**: Using **A1:A2** as **MonthlyTotals** in a **Formula**. -The **Named Ranges** support allows to assign a meaningful name to a specific cell or range of cells. This simplifies referencing and managing data within the Spreadsheet. Named Ranges can also be used in formulas, making them easier to read, understand, and maintain. +Suppose cells **A1** and **A2** contain monthly total values. Instead of writing a formula like **=SUM(A1:A2)**, a name such as **MonthlyTotals** can be assigned to the range **A1:A2**. -N> Named Ranges can be defined only for cells or ranges that contain values. +After assigning the name, the formula becomes: -### Creating Named Ranges via the UI +**=SUM(MonthlyTotals)** -**Named Ranges** can be created using the following methods: +This makes the formula easier to read and understand, especially when working with large spreadsheets or sharing them with others. -* Select the desired range of cells and enter a name in the **Name Box**. +### Creating named range via UI -* Select the range of cells, then click the **Name Manager** button in the Ribbon toolbar under the **Formulas** tab. +**Using the Name Box** -![Name Manager Dialog](./images/named-range.gif) +* Select the cell or range of cells to be named. +* Click inside the **Name Box** located near the formula bar. The current cell reference will be highlighted. +* Type a name that follows these rules: + - Start with a letter or an underscore. + - Do not include spaces. + - Avoid using names that look like cell references (e.g., A1, B2). +* Press **Enter** to complete the process. -### Editing or Deleting Named Ranges +![Named Range - Name Box](./images/namebox-namedrange.gif) -**Named Ranges** are managed through the **Name Manager** dialog, which supports editing and deletion. +**Using the Ribbon** -To edit a Named Range: +* Go to the **Formulas** tab in the **Ribbon** and click the **Name Manager** button to open the dialog. +* In the **Range Name** field, enter a unique and descriptive name. Type a name that follows these rules: + - Start with a letter or an underscore. + - Do not include spaces. + - Avoid using names that look like cell references (e.g., A1, B2). +* In the **Range Value** field, specify the cell or range to be named. This can be entered manually or selected from the sheet. The currently selected range is shown by default. +* Choose the appropriate **Scope** (either **Workbook** or **Worksheet**, as supported). +* Click the **Add Range** button to create the named range. The new entry will appear in the **Name Manager** list. +* Click **OK** to close the dialog and apply the changes. -* Open the **Name Manager** dialog. +![Named Range - Ribbon](./images/namemanager-ribbon.png) -* Select the Named Range to be edited. +![Named Range - Dialog](./images/namedrange-dialog.png) -* Click the **Edit** icon. +### Editing named range via UI -* Modify the name, range, or scope as needed. +* Open the **Name Manager** dialog box from the **Formulas** tab by clicking the **Name Manager** button. +* In the **Name Manager** dialog, select the **Named Range** required for editing from the list. +* Click the **Edit** icon provided for the selected named range. An editing panel will appear. +* Update the **Range Name**, **Range Value** or the **Scope** as necessary, following the standard naming and reference rules. +* Confirm changes by clicking the **Update Range** button, then click the **OK** button to commit the edit. The modifications will become immediately effective throughout all associated formulas. -* Click the **Update Range** button, then click **OK** button to save changes. +![Named Range - Dialog Editing](./images/namedrange-dialogedit.png) -To delete a Named Range: - -* Open the **Name Manager** dialog. +![Named Range - Editing](./images/namedrange-editing.png) -* Select the Named Range to be deleted. +### Deleting named range via UI -* Click the **Delete** icon, then click **OK** button to confirm. +* Open the **Name Manager** dialog box from the **Formulas** tab by selecting the **Name Manager** button. +* Select the **Named Range** targeted for deletion from the list. +* Click the **Delete** icon associated with the selected **Named Range**. +* Confirm the action by clicking the **OK** button in the Name Manager. When a named range is deleted from the workbook, any formula that used that name will stop working and show a **#NAME?** error. To fix the error, the formula must be updated with a valid range or name. -N> Deleting a Named Range used in formulas may cause formula errors. Ensure the Named Range is not referenced before deleting it. +N> Removing a named range that is used in formulas can cause errors in those formulas. Before deleting a named range, ensure it is not referenced anywhere in the Spreadsheet. If a worksheet is deleted, any named ranges created specifically within that worksheet will also be removed automatically. -![Edit and Delete - Named Range](./images/edit-and-delete.png) +![Named Range - Deleting](./images/namedrange-delete.png) ## Supported Formulas diff --git a/blazor/spreadsheet/images/caculation-manual.gif b/blazor/spreadsheet/images/caculation-manual.gif new file mode 100644 index 0000000000..c0ac23f986 Binary files /dev/null and b/blazor/spreadsheet/images/caculation-manual.gif differ diff --git a/blazor/spreadsheet/images/cell-selection.gif b/blazor/spreadsheet/images/cell-selection.gif new file mode 100644 index 0000000000..ee6110e842 Binary files /dev/null and b/blazor/spreadsheet/images/cell-selection.gif differ diff --git a/blazor/spreadsheet/images/clear-feature.png b/blazor/spreadsheet/images/clear-feature.png index 1baac64ea3..9252884fe6 100644 Binary files a/blazor/spreadsheet/images/clear-feature.png and b/blazor/spreadsheet/images/clear-feature.png differ diff --git a/blazor/spreadsheet/images/column-selection.gif b/blazor/spreadsheet/images/column-selection.gif new file mode 100644 index 0000000000..0ac6356036 Binary files /dev/null and b/blazor/spreadsheet/images/column-selection.gif differ diff --git a/blazor/spreadsheet/images/delete-unlocked-range.png b/blazor/spreadsheet/images/delete-unlocked-range.png new file mode 100644 index 0000000000..d2c8e2ed6b Binary files /dev/null and b/blazor/spreadsheet/images/delete-unlocked-range.png differ diff --git a/blazor/spreadsheet/images/edit-unlocked-range.png b/blazor/spreadsheet/images/edit-unlocked-range.png new file mode 100644 index 0000000000..83e45a108a Binary files /dev/null and b/blazor/spreadsheet/images/edit-unlocked-range.png differ diff --git a/blazor/spreadsheet/images/filter-contextmenu.png b/blazor/spreadsheet/images/filter-contextmenu.png new file mode 100644 index 0000000000..14efc3cde5 Binary files /dev/null and b/blazor/spreadsheet/images/filter-contextmenu.png differ diff --git a/blazor/spreadsheet/images/filter-ribbon.png b/blazor/spreadsheet/images/filter-ribbon.png new file mode 100644 index 0000000000..289cb3eb8b Binary files /dev/null and b/blazor/spreadsheet/images/filter-ribbon.png differ diff --git a/blazor/spreadsheet/images/format-cells.png b/blazor/spreadsheet/images/format-cells.png new file mode 100644 index 0000000000..3cbce85c64 Binary files /dev/null and b/blazor/spreadsheet/images/format-cells.png differ diff --git a/blazor/spreadsheet/images/format-columns.png b/blazor/spreadsheet/images/format-columns.png new file mode 100644 index 0000000000..612dfb7fed Binary files /dev/null and b/blazor/spreadsheet/images/format-columns.png differ diff --git a/blazor/spreadsheet/images/format-rows.png b/blazor/spreadsheet/images/format-rows.png new file mode 100644 index 0000000000..b18a928b3e Binary files /dev/null and b/blazor/spreadsheet/images/format-rows.png differ diff --git a/blazor/spreadsheet/images/formula-intellisense.gif b/blazor/spreadsheet/images/formula-intellisense.gif new file mode 100644 index 0000000000..2821b7f621 Binary files /dev/null and b/blazor/spreadsheet/images/formula-intellisense.gif differ diff --git a/blazor/spreadsheet/images/formulabar.png b/blazor/spreadsheet/images/formulabar.png new file mode 100644 index 0000000000..c91c89ed2e Binary files /dev/null and b/blazor/spreadsheet/images/formulabar.png differ diff --git a/blazor/spreadsheet/images/insert-columns.png b/blazor/spreadsheet/images/insert-columns.png new file mode 100644 index 0000000000..38c7729014 Binary files /dev/null and b/blazor/spreadsheet/images/insert-columns.png differ diff --git a/blazor/spreadsheet/images/insert-formula.gif b/blazor/spreadsheet/images/insert-formula.gif deleted file mode 100644 index c6e3880955..0000000000 Binary files a/blazor/spreadsheet/images/insert-formula.gif and /dev/null differ diff --git a/blazor/spreadsheet/images/insert-function.gif b/blazor/spreadsheet/images/insert-function.gif deleted file mode 100644 index 4f7ab57e1e..0000000000 Binary files a/blazor/spreadsheet/images/insert-function.gif and /dev/null differ diff --git a/blazor/spreadsheet/images/insert-hyperlink-disabled.png b/blazor/spreadsheet/images/insert-hyperlink-disabled.png new file mode 100644 index 0000000000..4cb63efd6d Binary files /dev/null and b/blazor/spreadsheet/images/insert-hyperlink-disabled.png differ diff --git a/blazor/spreadsheet/images/insert-hyperlink.png b/blazor/spreadsheet/images/insert-hyperlink.png new file mode 100644 index 0000000000..0e704d4736 Binary files /dev/null and b/blazor/spreadsheet/images/insert-hyperlink.png differ diff --git a/blazor/spreadsheet/images/insert-rows.png b/blazor/spreadsheet/images/insert-rows.png new file mode 100644 index 0000000000..b14afbc7bd Binary files /dev/null and b/blazor/spreadsheet/images/insert-rows.png differ diff --git a/blazor/spreadsheet/images/insertfunction-button.png b/blazor/spreadsheet/images/insertfunction-button.png new file mode 100644 index 0000000000..8e63665053 Binary files /dev/null and b/blazor/spreadsheet/images/insertfunction-button.png differ diff --git a/blazor/spreadsheet/images/insertfunction-dialog.png b/blazor/spreadsheet/images/insertfunction-dialog.png new file mode 100644 index 0000000000..42970677ec Binary files /dev/null and b/blazor/spreadsheet/images/insertfunction-dialog.png differ diff --git a/blazor/spreadsheet/images/insertfunction-ribbon.png b/blazor/spreadsheet/images/insertfunction-ribbon.png new file mode 100644 index 0000000000..62f3b8f96a Binary files /dev/null and b/blazor/spreadsheet/images/insertfunction-ribbon.png differ diff --git a/blazor/spreadsheet/images/interactive-cellselection.png b/blazor/spreadsheet/images/interactive-cellselection.png new file mode 100644 index 0000000000..b62850ea96 Binary files /dev/null and b/blazor/spreadsheet/images/interactive-cellselection.png differ diff --git a/blazor/spreadsheet/images/interactive-rangeselection.png b/blazor/spreadsheet/images/interactive-rangeselection.png new file mode 100644 index 0000000000..fe4324d2a6 Binary files /dev/null and b/blazor/spreadsheet/images/interactive-rangeselection.png differ diff --git a/blazor/spreadsheet/images/namebox-namedrange.gif b/blazor/spreadsheet/images/namebox-namedrange.gif new file mode 100644 index 0000000000..de2ce8153a Binary files /dev/null and b/blazor/spreadsheet/images/namebox-namedrange.gif differ diff --git a/blazor/spreadsheet/images/named-range.gif b/blazor/spreadsheet/images/named-range.gif deleted file mode 100644 index 07be726e5c..0000000000 Binary files a/blazor/spreadsheet/images/named-range.gif and /dev/null differ diff --git a/blazor/spreadsheet/images/namedrange-delete.png b/blazor/spreadsheet/images/namedrange-delete.png new file mode 100644 index 0000000000..778a20b180 Binary files /dev/null and b/blazor/spreadsheet/images/namedrange-delete.png differ diff --git a/blazor/spreadsheet/images/namedrange-dialog.png b/blazor/spreadsheet/images/namedrange-dialog.png new file mode 100644 index 0000000000..6b49e75c22 Binary files /dev/null and b/blazor/spreadsheet/images/namedrange-dialog.png differ diff --git a/blazor/spreadsheet/images/namedrange-dialogedit.png b/blazor/spreadsheet/images/namedrange-dialogedit.png new file mode 100644 index 0000000000..3e76846432 Binary files /dev/null and b/blazor/spreadsheet/images/namedrange-dialogedit.png differ diff --git a/blazor/spreadsheet/images/namedrange-editing.png b/blazor/spreadsheet/images/namedrange-editing.png new file mode 100644 index 0000000000..e91726e4e9 Binary files /dev/null and b/blazor/spreadsheet/images/namedrange-editing.png differ diff --git a/blazor/spreadsheet/images/namemanager-ribbon.png b/blazor/spreadsheet/images/namemanager-ribbon.png new file mode 100644 index 0000000000..d670adbdeb Binary files /dev/null and b/blazor/spreadsheet/images/namemanager-ribbon.png differ diff --git a/blazor/spreadsheet/images/protect-sheet-contextmenu.png b/blazor/spreadsheet/images/protect-sheet-contextmenu.png new file mode 100644 index 0000000000..2fb7506b34 Binary files /dev/null and b/blazor/spreadsheet/images/protect-sheet-contextmenu.png differ diff --git a/blazor/spreadsheet/images/protect-sheet-warning.png b/blazor/spreadsheet/images/protect-sheet-warning.png new file mode 100644 index 0000000000..f212356354 Binary files /dev/null and b/blazor/spreadsheet/images/protect-sheet-warning.png differ diff --git a/blazor/spreadsheet/images/protect-workbook-contextmenu.png b/blazor/spreadsheet/images/protect-workbook-contextmenu.png new file mode 100644 index 0000000000..b30fd07cac Binary files /dev/null and b/blazor/spreadsheet/images/protect-workbook-contextmenu.png differ diff --git a/blazor/spreadsheet/images/row-selection.gif b/blazor/spreadsheet/images/row-selection.gif new file mode 100644 index 0000000000..f3d978cdb3 Binary files /dev/null and b/blazor/spreadsheet/images/row-selection.gif differ diff --git a/blazor/spreadsheet/images/sort-contextmenu.png b/blazor/spreadsheet/images/sort-contextmenu.png new file mode 100644 index 0000000000..6cd789ad40 Binary files /dev/null and b/blazor/spreadsheet/images/sort-contextmenu.png differ diff --git a/blazor/spreadsheet/images/sort-ribbon.png b/blazor/spreadsheet/images/sort-ribbon.png new file mode 100644 index 0000000000..44d0a3fc09 Binary files /dev/null and b/blazor/spreadsheet/images/sort-ribbon.png differ diff --git a/blazor/spreadsheet/protection.md b/blazor/spreadsheet/protection.md index 0b10c16607..bffa38de95 100644 --- a/blazor/spreadsheet/protection.md +++ b/blazor/spreadsheet/protection.md @@ -1,110 +1,220 @@ --- layout: post title: Protect Sheet in Blazor Spreadsheet Component | Syncfusion -description: Checkout and learn here all about protect sheet in Syncfusion Blazor Spreadsheet component and more. +description: Checkout and learn here all about protect sheet and workbook in Syncfusion Blazor Spreadsheet component and more. platform: Blazor control: Spreadsheet documentation: ug --- -# Protect Sheet in Blazor Spreadsheet component +# Protect Sheet and Workbook in Blazor Spreadsheet component -Sheet protection is used to prevent unauthorized modification of data within the sheet. +The Syncfusion Blazor Spreadsheet component offers protection features to secure data by restricting unauthorized modifications. Sheet protection prevents changes to cell content in the active sheet, while workbook protection safeguards the workbook's structure, such as preventing the addition, deletion, duplication, hiding, moving, or renaming of sheets. -## Protect Sheet +## Protect sheet -The **Protect Sheet** support helps prevent accidental changes such as editing, moving, or deleting data. Protection can be applied with or without a password, depending on the level of security required. +The **Protect Sheet** support restricts modifications to a sheet's content, such as editing, formatting or deleting data. Protection can be applied with or without a password, based on the desired security level. The **Protect Sheet** dialog secures sheet content by controlling permitted edits and deletions. It contains three primary sections: -### Protecting sheets via the UI +* **Manage Protection**: This section enables the configuration of protection settings, including the option to apply a password. It restricts unauthorized changes to the sheet. -In the active sheet, the sheet protection can be done by any of the following ways: +* **Unlock Range**: This section allows the specification of cells or ranges that remain editable, even when the majority of the sheet is protected. It facilitates limited editing permissions within a secure environment. -* Select **Protect Sheet** from the **Review** tab in the Ribbon toolbar and choose the desired options. +* **Sheet Options**: This section allows customization of the actions permitted on a protected sheet, ensuring versatility in the sheet's usage while upholding its security. -* Right-click the sheet tab context menu option, select **Protect Sheet** from the context menu, and choose the desired options. +Each section plays an integral role in maintaining the protection and integrity of the sheet's content. -![Protected Sheet Dialog](./images/protect-sheet.gif) +### Manage Protection -### Unlock particular cell or ranges in the protected sheet via the UI +Sheet protection can be enabled through the user interface(UI) in the active sheet using one of the following methods: -To allow editing of specific cells or ranges in a protected sheet: +* Select **Protect Sheet** from the **Review** tab in the **Ribbon** and choose the desired options. -* Open the **Protect Sheet** dialog. +![Protected Sheet - Ribbon](./images/protect-sheet.gif) -* Navigate to the **Unlock Range** tab. +* Right-click the sheet tab context menu option, select **Protect Sheet** from the **Context Menu**, and choose the desired options. -* Select the desired cell(s) or range(s) that should remain editable, even when the sheet is protected. These cells will not be locked and can be modified while other parts of the sheet remain restricted. +![Protected Sheet - Context Menu](./images/protect-sheet-contextmenu.png) + +Protecting a sheet includes features that allow for the setup of an optional password. In this scenario, no cells or ranges are specified as unlocked, and all additional sheet options remain in disabled state. This ensures that the sheet is fully protected, with strict access controls applied throughout the entire sheet. + +### Unlock Range + +Specific cells or ranges in a protected sheet can be unlocked to allow editing while maintaining restrictions on the rest of the sheet. This option supports scenarios where selective data editing is required. + +To unlock specific cells or ranges in a protected sheet, follow these steps: + +* Open the **Protect Sheet** dialog from the **Review** tab or the sheet tab **Context Menu**. + +* Navigate to the **Unlock Range** tab in the dialog. + +* Select the desired cells or ranges that should remain editable. + +* Confirm the settings and apply protection to the sheet. ![Unlocked Ranges - Protected Sheet UI](./images/unlocked-range.gif) -### Protection settings in a protected sheet +*To edit existing unlocked ranges*: + +* In the **Protect Sheet** dialog, under the **Unlock Range** tab, view the unlocked ranges list, which shows all ranges currently set as editable in the protected sheet. + +* Position the cursor over a range to reveal the **Edit** icon. + +* Click the **Edit** icon, modify the range name or cells (e.g., change "A1:A10" to "A1:A100"). + +* Click **Update Range** button to save the changes. + +![Edit Unlocked Ranges - Protected Sheet UI](./images/edit-unlocked-range.png) + +*To delete an existing unlocked range*: -By default, when a sheet is protected, most actions such as formatting, inserting, sorting, and filtering are restricted, while selecting cells remains allowed. +* In the unlocked ranges list, position the cursor over the range to reveal the **Delete** icon. + +* Click the **Delete** icon to remove the range. Once removed, the range becomes protected and cannot be edited, aligning with the sheet's protection restrictions. + +![Delete Unlocked Ranges - Protected Sheet UI](./images/delete-unlocked-range.png) + +**Allowed actions in protected sheets** + +When a sheet is protected, certain operations are always permitted on unlocked cells or ranges, even if additional options in the Sheet options are not selected. These operations include basic editing, formatting, and data entry. + +* **Clipboard Actions** : + - **Cut** operations are not permitted for either locked or unlocked cells in a protected sheet to prevent unintended data removal. + - **Copy** operations are permitted for both locked and unlocked cells. + - **Paste** operations are permitted only in unlocked cells to prevent unintended modifications to protected areas. For example, copying a value from a locked cell and pasting it into an unlocked cell is supported, but pasting into a locked cell is prohibited. + +* **Autofill Actions**: **Autofill** is permitted only for unlocked cells, ensuring protected data remains unchanged. + +* **Cell Editing**: Editing a cell content, such as typing new values or modifying existing data, is permitted only in unlocked cells. + +* **Formula Bar - Editing**: Editing cell content via the formula bar, including entering or modifying formulas, inserting formulas using the insert function, or editing text or values, is allowed only in unlocked cells. + +* **Clear Actions**: **Clear All** and **Clear Contents** are allowed only for unlocked cells, preserving protected data. + +These restrictions ensure that only designated unlocked areas can be modified, providing control over editable content in a protected sheet. If clipboard actions, autofill actions, cell editing, or formula bar editing are attempted on locked cells, a warning popup appears to indicate the action is restricted. + +![Warning - Protected Sheet UI](./images/protect-sheet-warning.png) + +### Sheet Options + +In a protected sheet, certain actions such as formatting, inserting, sorting, and filtering are restricted by default to maintain data integrity and prevent unauthorized modifications. The protection settings provide granular control, allowing specific actions to be enabled according to the needs of the Spreadsheet. To enable specific functionalities while the sheet is protected: * Open the **Protect Sheet** dialog from the **Review** tab. -* In the dialog, navigate to the **Sheet Options** tab to view available protection settings. +* Navigate to the **Sheet Options** tab to view available protection settings. * Select or deselect the desired options to allow or restrict specific actions. * Click **OK** to apply the protection settings. -The available protection settings in Spreadsheet are: +![Protection Settings - Dialog](./images/sheet-options.png) + +The available protection settings in Spreadsheet component include: | Options | Description | |------------------------|---------| -| Select Cells | Allows cell selection. | -| Format Cells | Allows cell formatting. | -| Format Rows | Allows row formatting. | -| Format Columns | Allows column formatting. | -| Insert Columns | Allows inserting new columns. | -| Insert Rows | Allows inserting new rows. | -| Insert Hyperlinks | Allows adding hyperlinks. | -| Sort | Allows sorting data. | -| Filter | Allows filtering data. | - -![Protection Settings Dialog](./images/sheet-options.png) +| Select Locked Cells | Permits selection of locked cells in the protected sheet. This option cannot be enabled alone. Enabling it automatically enables the option to select unlocked cells. | +| Select UnLocked Cells | Permits selection of unlocked cells in the protected sheet. | +| Format Cells | Permits formatting of cells, such as changing fonts or colors. | +| Format Rows | Permits formatting of rows, such as adjusting row height. | +| Format Columns | Permits formatting of columns, such as adjusting column width. | +| Insert Columns | Permits inserting new columns in the protected sheet. | +| Insert Rows | Permits inserting new rows in the protected sheet. | +| Insert Hyperlinks | Permits adding hyperlinks to unlocked cells in the protected sheet. | +| Sort | Permits sorting data in unlocked ranges within the protected sheet. | +| Filter | Permits applying filters to data in unlocked ranges within the protected sheet. | + + +*Impacts of sheet Protection on Ribbon and Context Menu functionality* + +- **Select Locked Cells**: Allows selecting and moving across locked cells. If this is disabled, these cells can't be selected. + +- **Select Unlocked Cells**: Allows selecting and modifying unlocked cells. If this is disabled, these cells cannot be selected, and interactions like editing, formatting, or any modifications cannot occur. + +- **Format Cells**: Allows changing fonts, colors, or styles. When this option enabled, the **Home** tab in the **Ribbon** displays options like Bold, Italic, Font Size, and Fill Color for both locked and unlocked cells. Additionally, the **Clear Formats** option enables in the **Ribbon** for unlocked cells only. + +![Format Cells - Protected Sheet UI](./images/format-cells.png) + +- **Format Rows**: Allows formatting of rows, such as adjusting row height. When this option is enabled, the row resize cursor becomes active for both locked and unlocked cells. + +![Format Rows - Protected Sheet UI](./images/format-rows.png) + +- **Format Columns**: Allows formatting of columns, such as adjusting column width. When this option is enabled, the column resize cursor becomes active for both locked and unlocked cells. + +![Format Columns - Protected Sheet UI](./images/format-columns.png) + +- **Insert Columns**: Allows adding new columns in the protected sheet. When this option is enabled, right-clicking a single column header or a range of selected column headers displays the **Insert Column** option in the context menu. This applies to both locked and unlocked cells. + +![Insert Columns - Protected Sheet UI](./images/insert-columns.png) + +- **Insert Rows**: Allows adding new rows in the protected sheet. When this option is enabled, right-clicking a single row header or a range of selected row headers displays the **Insert Row** option in the context menu. This applies to both locked and unlocked cells. + +![Insert Rows - Protected Sheet UI](./images/insert-rows.png) + +- **Insert Hyperlinks**: Allows adding hyperlinks to unlocked cells in the protected sheet. When this option is enabled, the **Insert** tab in the **Ribbon** displays the **Link** option, and the **Hyperlink** option becomes available in the context menu. Additionally, the **Clear Hyperlink** option appears in the **Ribbon** for unlocked cells only. + +![Insert Hyperlink - Protected Sheet UI](./images/insert-hyperlink.png) + +- For locked cells, the **Link** and **Hyperlink** options in the **Ribbon** and **Context Menu** are disabled, preventing hyperlink addition. + +![Insert Hyperlink Disabled- Protected Sheet UI](./images/insert-hyperlink-disabled.png) + +- **Sort**: Allows sorting data in unlocked ranges within the protected sheet. When this option is enabled, the **Home** tab in the **Ribbon** displays the **Sort** option, and the **Sort** option also appears in the context menu. + +![Sort Context Menu- Protected Sheet UI](./images/sort-contextmenu.png) +![Sort Ribbon- Protected Sheet UI](./images/sort-ribbon.png) + +- For locked cells, a warning popup appears if sorting is attempted, indicating the action is not allowed. + +![Protect Sheet Warning- Protected Sheet UI](./images/protect-sheet-warning.png) + +- **Filter**: Allows applying filters to data in unlocked ranges within the protected sheet. When this option is enabled, the **Home** tab in the **Ribbon** displays the **Filter** option, and the **Filter** option also appears in the context menu. + +![Filter Contextmenu- Protected Sheet UI](./images/filter-contextmenu.png) +![Filter Ribbon- Protected Sheet UI](./images/filter-ribbon.png) + +- For locked cells, a warning popup appears if filtering is attempted, indicating the action is not allowed. + +![Protect Sheet Warning- Protected Sheet UI](./images/protect-sheet-warning.png) ## Unprotect Sheet -The **Unprotect Sheet** support restores access to all actions that were previously restricted by sheet protection. Once unprotected, the sheet allows full interaction, including editing, formatting, inserting, and deleting content. +The **Unprotect Sheet** support removes restrictions on actions previously limited by sheet protection, enabling full interaction, including editing, formatting, inserting, and deleting content. -### Unprotecting sheets via the UI +To unprotect a sheet, follow one of these methods: -In the active sheet, the sheet unprotection can be done by any of the following ways: +* Select **Unprotect Sheet** from the **Review** tab in the **Ribbon**. -* Select **Unprotect Sheet** from the **Review** tab in the Ribbon toolbar. +* Right-click the sheet tab context menu option and select **Unprotect Sheet** from the **Context Menu**, and enter the password if prompted. -* Right-click the sheet tab context menu option and select **Unprotect Sheet** from the context menu. +If a password was set during protection, the correct password must be entered to unprotect the sheet. If no password was set, the sheet can be unprotected directly without entering a password. -![Unprotected Sheet Dialog](./images/unprotect-sheet.png) +![Unprotected Sheet - Dialog](./images/unprotect-sheet.png) ## Protect Workbook -The **Protect Workbook** support restricts structural modifications within a workbook. Actions such as inserting, deleting, renaming, or hiding sheets are disabled when this protection is enabled. Protection can be configured with or without a password, depending on the desired level of security. +The **Protect Workbook** support prevents structural modifications within a workbook, such as inserting, deleting, renaming, duplicating, hiding, moving, or copying sheets. Protection can be applied with or without a password, depending on the required security level. +When the workbook is protected, **Context Menu** options in the **Sheet Tab** related to structural changes are disabled to prevent modifications. -### Protecting workbooks via the UI +![Protected Workbook - Context Menu](./images/protect-workbook-contextmenu.png) -To protect the workbook: +To protect the workbook, follow these steps: -* Go to the **Review** tab in the Ribbon toolbar. +* Navigate to the **Review** tab in the **Ribbon**. * Select **Protect Workbook**, enter and confirm the desired password, and then click **OK** to apply the protection. -![Protected Workbook Dialog](./images/protect-workbook.gif) +![Protected Workbook - Dialog](./images/protect-workbook.gif) ## Unprotect Workbook -The **Unprotect Workbook** support enables structural modifications within a workbook. Once unprotected, actions such as inserting, deleting, renaming, moving, copying, hiding, or unhiding sheets become available. - -### Unprotecting workbooks via the UI +The **Unprotect Workbook** support restores the ability to perform structural modifications, enabling actions such as inserting, deleting, renaming, moving, copying, hiding, or unhiding sheets. -To unprotect the workbook: +To unprotect the workbook, follow these steps: -* Select **Unprotect Workbook** from the **Review** tab in the Ribbon toolbar. +* Select **Unprotect Workbook** from the **Review** tab in the **Ribbon**. -* Enter the correct password in the dialog box, then click **OK**. +* If a password was set during protection, enter the correct password in the dialog box, then click **OK** to unprotect the workbook. If no password was set, the workbook can be unprotected directly without entering a password. -![Unprotected Workbook Dialog](./images/unprotect-workbook.png) \ No newline at end of file +![Unprotected Workbook - Dialog](./images/unprotect-workbook.png) \ No newline at end of file diff --git a/blazor/spreadsheet/selection.md b/blazor/spreadsheet/selection.md index 7765b6f57e..a23d79d819 100644 --- a/blazor/spreadsheet/selection.md +++ b/blazor/spreadsheet/selection.md @@ -9,27 +9,29 @@ documentation: ug # Selection in Blazor Spreadsheet component -The selection feature in the Spreadsheet component enables interactive highlighting and manipulation of cells, rows, or columns for data analysis and editing operations. The functionality offers intuitive mouse and keyboard interactions for efficient data management. +The Syncfusion Blazor Spreadsheet component offers powerful selection functionality that allows to interactively highlight and manipulate cells, rows, and columns. This feature serves as the backbone for key operations such as data entry, editing, formatting, and analysis. -The Blazor Spreadsheet provides multiple selection options to manage and analyze data effectively: +Selections can be made using both mouse and keyboard inputs, enabling seamless and efficient data handling across various workflows. The Blazor Spreadsheet component supports multiple selection modes, including single cells, contiguous ranges, and non-contiguous selections, offering flexibility for diverse data manipulation tasks. -* **Cell Selection** - Select individual cells or ranges of cells for data manipulation -* **Row Selection** - Select entire rows for row-based operations -* **Column Selection** - Select entire columns for column-based operations +The Blazor Spreadsheet component supports multiple selection methods to facilitate efficient data management and analysis: -**Accessing selection via the UI** +- **Cell Selection** – Enables selection of a single cell or a range of cells for performing data-related operations. +- **Row Selection** – Allows selection of entire rows to carry out row-specific tasks. +- **Column Selection** – Permits selection of entire columns for column-based actions. + +**Accessing selection via UI** In the active sheet, selection can be performed using any of the following ways: * **Using Mouse Interaction**: - * Click to select individual cells - * Click and drag to select ranges - * Click row or column headers for full row or column selection + * Click to select individual cells. + * Click and drag to select ranges. + * Click row or column headers for full row or column selection. * **Using Keyboard Navigation**: - * Use **Arrow** keys to navigate and select cells - * Use **Shift + Arrow** keys for range selection - * Use **Ctrl + Click** for non-adjacent selections + * Use **Arrow** keys to navigate and select cells. + * Use **Shift + Arrow** keys for range selection. + * Use **Ctrl + Click** for non-adjacent selections. * **Using Name Box**: Enter cell references or range names and press **Enter** key to select the specified range. @@ -37,46 +39,60 @@ In the active sheet, selection can be performed using any of the following ways: The Blazor Spreadsheet component allows selecting individual cells or ranges of cells for various data operations. Cell selection forms the foundation of most Spreadsheet interactions and serves as the basis for data entry and formatting. -The single cell selection mode allows users to focus on a specific cell for data entry or formatting tasks. Range selection enables multiple adjacent cells to be selected for batch operations such as formatting, data entry, or calculations. Multiple range selection provides the ability to select non-adjacent cells or ranges, making it possible to apply operations to scattered data within the sheet. +The single cell selection mode enables focus on a specific cell for data entry or formatting tasks. Range selection allows multiple adjacent cells to be selected for batch operations, such as formatting, data entry, or calculations. Multiple range selection supports the selection of non-adjacent cells or ranges, facilitating operations on scattered data within the sheet. + +- **Single Cell Selection** focuses on a specific cell for targeted operations. +- **Range Selection** allows selection of multiple adjacent cells for batch operations. +- **Multiple Range Selection** enables selection of non-adjacent cells or ranges for applying operations across scattered data or non-contiguous data within the sheet. -**Selecting ranges via the UI** +N> The **Select All** operation highlights all cells in the active worksheet. To perform this operation, press the keyboard shortcut **Ctrl+A** or click the **Select All** button at the intersection of the row and column headers in the top-left corner of the worksheet. -To select non-adjacent ranges: +**Selecting ranges via UI** -* Select the first cell or range using any of the above ways -* Hold **Ctrl** and click additional cells or drag to select additional ranges -* Each selected range is highlighted independently -* The **Name Box** displays the first selected cell reference +* Select the first cell or range using mouse or keyboard. +* Hold **Ctrl** and click or drag to select additional cells or ranges. +* Each selected range is highlighted independently. +* The **Name Box** displays the first selected cell reference. + +![Cell Selection](./images/cell-selection.gif) ## Row selection -The row selection feature allows entire rows to be selected for operations such as formatting or insertion. This selection type is especially useful when working with complete records or data entries. Rows can be selected individually or as multiple row groups. +Row selection allows entire rows to be selected for operations such as formatting, insertion, or deletion. This method is useful when working with complete records or structured data entries. + +**Selecting rows via UI** -**Selecting rows via the UI** +Row selection can be performed using the following methods: -The row selection operation can be performed using the following methods: +- **Adjacent Rows**: Click the first row header, then drag to the last desired row header. +- **Adjacent Rows with Keyboard**: Click the first row header, then hold **Shift** and click the last row header. +- **Non-Adjacent Rows**: Hold **Ctrl** while clicking individual row headers. +- **Range with Keyboard**: Use **Shift + Arrow** keys after selecting the initial row. -* **Adjacent rows**: Click the first row header, then drag to the last desired row header -* **Adjacent rows with keyboard**: Click the first row header, then hold **Shift** key and click the last row header -* **Non-adjacent rows**: Hold **Ctrl** key while clicking individual row headers -* **Range with keyboard**: Use **Shift + Arrow** keys after selecting the initial row +![Row Selection](./images/row-selection.gif) ## Column selection -The column selection feature allows entire columns to be selected for operations such as formatting and sorting. This selection type is essential for working with data fields or attributes. Columns can be selected individually or as multiple column groups. +Column selection enables entire columns to be selected for operations such as formatting, sorting, or applying formulas. This method is essential when working with data fields or attributes. -**Selecting columns via the UI** +**Selecting columns via UI** -The column selection operation can be performed using the following methods: +Column selection can be performed using the following methods: -* **Adjacent columns**: Click the first column header, then drag to the last desired column header -* **Adjacent columns with keyboard**: Click the first column header, then hold **Shift** and click the last column header -* **Non-adjacent columns**: Hold **Ctrl** while clicking individual column headers -* **Range with keyboard**: Use **Shift + Arrow** keys after selecting the initial column +- **Adjacent Columns**: Click the first column header, then drag to the last desired column header. +- **Adjacent Columns with Keyboard**: Click the first column header, then hold **Shift** and click the last column header. +- **Non-Adjacent Columns**: Hold **Ctrl** while clicking individual column headers. +- **Range with Keyboard**: Use **Shift + Arrow** keys after selecting the initial column. -## Implementing selection programmatically +![Column Selection](./images/column-selection.gif) -The Spreadsheet component supports comprehensive programmatic selection using the [SelectRangeAsync()](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Spreadsheet.SfSpreadsheet.html#Syncfusion_Blazor_Spreadsheet_SfSpreadsheet_SelectRangeAsync_System_String_) method. This method accepts various range formats and selection patterns. +## Selection via programmatically + +Selection can be performed programmatically through the [SelectRangeAsync](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Spreadsheet.SfSpreadsheet.html#Syncfusion_Blazor_Spreadsheet_SfSpreadsheet_SelectRangeAsync_System_String_) method. Programmatic selection is beneficial for scenarios requiring automated data processing, batch operations, and integration with business logic. The available parameter in the `SelectRangeAsync` method are: + +| Parameter | Type | Description | +|-------------|-------------------|-------------| +| address | string (optional) | Specifies the target range to be selected within the active sheet. This parameter accepts various address formats, including a single cell such as **"A1"**, a contiguous range such as **"A1:B5"**, and multiple non-contiguous ranges separated by spaces, such as **"A1:B5 D1:E5"**. To select an entire row, use a format like **"A1:GR1"**, which selects the first row across the default 200 columns. To select an entire column, use a format like **"A1:A1000"**, which selects Column A across the default 1000 rows. These default limits may vary depending on the `ColumnCount` or `RowCount` settings, or the data present in the Spreadsheet. If the value is null or an empty string, no selection will occur. If an invalid entry is provided, the operation will be ignored without generating an error. | {% tabs %} {% highlight razor tabtitle="Index.razor" %} @@ -84,17 +100,15 @@ The Spreadsheet component supports comprehensive programmatic selection using th @using Syncfusion.Blazor.Spreadsheet @using Syncfusion.Blazor.Buttons - + - + @code { - public byte[] DataSourceBytes { get; set; } - - public SfSpreadsheet SpreadsheetRef { get; set; } + public SfSpreadsheet SpreadsheetInstance { get; set; } protected override void OnInitialized() { @@ -102,15 +116,55 @@ The Spreadsheet component supports comprehensive programmatic selection using th DataSourceBytes = File.ReadAllBytes(filePath); } - public async Task SelectRangeHandler() + public async Task SelectRange() { - await SpreadsheetRef.SelectRangeAsync("A5:GR5"); + // Selects a contiguous range of cells from A1 to C3. + await SpreadsheetInstance.SelectRangeAsync("A1:C3"); + + // Selects the entire first row, spanning Columns A through GR (maximum column supported). + await SpreadsheetInstance.SelectRangeAsync("A1:GR1"); + + // Selects the entire Column A, covering rows 1 through 1000. + await SpreadsheetInstance.SelectRangeAsync("A1:A1000"); } } {% endhighlight %} {% endtabs %} -The following image illustrates the comprehensive selection capabilities available in the Blazor Spreadsheet component, including cell, row, and column selection using both mouse and keyboard interactions. +## Events + +The Syncfusion Blazor Spreadsheet component includes the [Selected](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Spreadsheet.SpreadsheetEvents.html#Syncfusion_Blazor_Spreadsheet_SpreadsheetEvents_Selected) event, which is triggered automatically after a selection is made—either through user interface(UI) or programmatically via the `SelectRangeAsync` method. This event enables the execution of custom logic when there is a change in the selection of cells, rows, or columns. The associated [SelectedEventArgs](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Spreadsheet.SelectedEventArgs.html) object provides details about the selected range, enabling functionalities such as tracking selection patterns, applying validation rules, updating related UI elements, initiating data analysis, and integrating with external systems. + +| Event Arguments | Description | +|----------------|-------------| +| Range | Gets the range of cells that have been selected. The format of the returned value can vary, including a single cell such as **"SheetName!A1"**, a cell range such as **"SheetName!A1:B10"**, a column selection such as **"SheetName!A1:A1000"**, or multiple column selections such as **"SheetName!A1:A1000 B1:B1000"**. Row selections are represented using formats like for a single row or **"SheetName!A1:GR1 A2:GR2"** for multiple rows. An entire sheet selection is indicated by a format such as **"SheetName!A1:GR1000"**. Mixed selections involving columns, rows, and individual cells are also supported, for example **"SheetName!A1:GP1 D1:D1000 A5:G5"**. | + +{% tabs %} +{% highlight razor tabtitle="Index.razor" %} + +@using Syncfusion.Blazor.Spreadsheet -![Comprehensive selection operation](./images/selection-types.gif) + + + + + +@code { + public byte[] DataSourceBytes { get; set; } + + protected override void OnInitialized() + { + string filePath = "wwwroot/Sample.xlsx"; + DataSourceBytes = File.ReadAllBytes(filePath); + } + + public void OnSelected(SelectedEventArgs args) + { + // Prints the selected range. + Console.WriteLine($"Selected Range: {args.Range}"); + } +} + +{% endhighlight %} +{% endtabs %}