Clipboard in Blazor Spreadsheet component

14 Oct 202524 minutes to read

The Spreadsheet component supports clipboard operations such as Cut, Copy, and Paste. These operations can be managed using the EnableClipboard property, which is set to true by default.

The keyboard shortcuts are available to perform clipboard operations efficiently within the Spreadsheet component. Ctrl+C copies the selected cells, Ctrl+X cuts the selected cells, and Ctrl+V pastes the content from the clipboard.

When EnableClipboard is set to false, the Cut and Copy options are removed from the Ribbon and Context Menu. Additionally, shortcut keys and API methods for clipboard operations are disabled. If a worksheet is protected, cut and paste operations are also disabled. For more details on worksheet protection, refer to the Worksheet Protection topic.

Cut

The Cut operation removes data from selected cells, rows, or columns within a worksheet and temporarily stores the content on the clipboard. When the content is pasted to a new location, the original data is deleted from its source. This behavior enables the relocation of content within the Spreadsheet.

Cut operations via UI

The Cut operation can be performed through the user interface (UI) using any of the following methods:

Using the Ribbon

  • Select the cell or range of cells to cut.
  • Click the Cut button in the Home tab of the Ribbon. This action cuts the selected content and places it on the clipboard.

Cut - Ribbon

Using the Context Menu

  • Select the cell or range of cells to cut the content.
  • Right-click on the selected cell or range of cells.
  • Choose the Cut option from the context menu.

Cut - Context Menu

Cut operations programmatically

The CutCellAsync method allows performing cut operations within any sheet. This method copies the specified cell or range and its properties (including value, format, style, etc.) to the clipboard and removes it from the sheet. It supports multiple scenarios for cutting cells or ranges. Below are the details for each scenario, including code examples and parameter information.

The Cut operation will not execute if an invalid or out-of-bounds cell range is specified. All cell references must be within the defined worksheet boundaries to ensure successful execution of the operation.

Cut active range

When CutCellAsync method is invoked without any parameters, the content is automatically cut from the most recently selected range, provided an active selection exists. If no range is currently selected, the method defaults to cutting the content from the active cell.

@using Syncfusion.Blazor.Spreadsheet

<button @onclick="CutActiveCell">Cut Active Cell</button>

<SfSpreadsheet @ref=SpreadsheetInstance DataSource="DataSourceBytes">
    <SpreadsheetRibbon></SpreadsheetRibbon>
</SfSpreadsheet>

@code {
    public byte[] DataSourceBytes { get; set; }
    public SfSpreadsheet SpreadsheetInstance;

    protected override void OnInitialized()
    {
        string filePath = "wwwroot/Sample.xlsx";
        DataSourceBytes = File.ReadAllBytes(filePath);
    }

    public async Task CutActiveCell()
    {
        // Cuts content from the currently active cell or selected range in the active worksheet.
        await SpreadsheetInstance.CutCellAsync();
    }
}

Cut specific range in active sheet

To cut content from specific cells in the active worksheet, a cell address or a range of cell addresses must be passed as a parameter to the CutCellAsync method. When a valid cell or range is specified, the Spreadsheet component cuts the corresponding content and places it on the clipboard, making it available for pasting in another location.

The available parameters in the CutCellAsync method are:

Parameter Type Description
cellAddress string (optional) Specifies the target cell or range of cells to be cut. Accepts either a single cell reference (for example, “A1”) or a range (for example, “A1:B5”) from the active worksheet. If no parameter is provided, the currently selected cell or range will be used for the Cut operation. 
@using Syncfusion.Blazor.Spreadsheet

<button @onclick="CutCell">Cut Cell</button>
<button @onclick="CutRange">Cut Range</button>

<SfSpreadsheet @ref=SpreadsheetInstance DataSource="DataSourceBytes">
    <SpreadsheetRibbon></SpreadsheetRibbon>
</SfSpreadsheet>

@code {
    public byte[] DataSourceBytes { get; set; }
    public SfSpreadsheet SpreadsheetInstance;

    protected override void OnInitialized()
    {
        string filePath = "wwwroot/Sample.xlsx";
        DataSourceBytes = File.ReadAllBytes(filePath);
    }

    public async Task CutCell()
    {
        // Cuts the specified cell from the active worksheet.
        await SpreadsheetInstance.CutCellAsync("A2"); 
    }

    public async Task CutRange()
    {
        // Cuts a specified range of cells from the active worksheet.
        await SpreadsheetInstance.CutCellAsync("A1:D10");
    }
}

Cut specific range in different sheet

To cut content from a specific worksheet, the source sheet name must be included along with the cell reference in the parameter passed to the CutCellAsync method. When specifying a sheet name, an exclamation mark (!) must be used to separate the sheet name from the cell reference. Upon execution, the Spreadsheet component cuts the designated content and places it on the clipboard, making it available for pasting in another location.

The available parameters in the CutCellAsync method are:

Parameter Type Description
cellAddress string (optional) Specifies the cell or range of cells to be cut. Accepts either a single cell reference (for example, “Sheet1!A1”) or a range (for example, “Sheet2!A1:C5”) from a specific worksheet. If no parameter is provided, the currently selected cell or range from the active worksheet will be used for the cut operation. 
@using Syncfusion.Blazor.Spreadsheet

<button @onclick="CutCellFromSpecificSheet">Cut Cell from Specific Sheet</button>
<button @onclick="CutRangeFromSpecificSheet">Cut Range from Specific Sheet</button>

<SfSpreadsheet @ref=SpreadsheetInstance DataSource="DataSourceBytes">
    <SpreadsheetRibbon></SpreadsheetRibbon>
</SfSpreadsheet>

@code {
    public byte[] DataSourceBytes { get; set; }
    public SfSpreadsheet SpreadsheetInstance;

    protected override void OnInitialized()
    {
        string filePath = "wwwroot/Sample.xlsx";
        DataSourceBytes = File.ReadAllBytes(filePath);
    }

    public async Task CutCellFromSpecificSheet()
    {
        
        // Specifies the address, along with the worksheet name, from which the content will be cut.
        await SpreadsheetInstance.CutCellAsync("Sheet1!B2");
    }

    public async Task CutRangeFromSpecificSheet()
    {
        // Cuts a specified range from a specific worksheet.
        await SpreadsheetInstance.CutCellAsync("Sheet2!B3:E8");
    }
}

Copy

The Copy operation duplicates data from a selected range of cells, rows, or columns within a worksheet and temporarily stores it on the clipboard. Unlike the Cut operation, copying retains the original content in its source location, allowing the data to be reused without modification.

Copy operations via UI

The copy operation can be performed through the UI using one of the following methods:

Using the Ribbon

  • Select the cell or range of cells to copy.
  • Click the Copy button in the Home tab of the Ribbon. This action duplicates the selected cell or range of cells and places the content on the clipboard.

Copy - Ribbon

Using the Context Menu

  • Select the cell or range of cells to copy.
  • Right-click on the selected cell or range of cells.
  • Choose the Copy option from the context menu.

Copy - Context Menu

Copy operations programmatically

The CopyCellAsync method enables performing copy operations within any sheet. This method copies the specified cell or range of cells along with its properties (including value, format, style, etc.) to the clipboard. It supports multiple scenarios for copying cells or ranges. Below are the details for each scenario, including code examples and parameter information.

The Copy operation will not execute if an invalid or out-of-bounds cell range is specified. All cell references must be within the defined worksheet boundaries to ensure successful execution of the operation.

Copy active range

When CopyCellAsync method is invoked without any parameters, the content is automatically copied from the most recently selected range, provided an active selection exists. If no range is selected, the method defaults to copying the content from the active cell.

@using Syncfusion.Blazor.Spreadsheet

<button @onclick="CopyActiveCell">Copy Active Cell</button>

<SfSpreadsheet @ref=SpreadsheetInstance DataSource="DataSourceBytes">
    <SpreadsheetRibbon></SpreadsheetRibbon>
</SfSpreadsheet>

@code {
    public byte[] DataSourceBytes { get; set; }
    public SfSpreadsheet SpreadsheetInstance;

    protected override void OnInitialized()
    {
        string filePath = "wwwroot/Sample.xlsx";
        DataSourceBytes = File.ReadAllBytes(filePath);
    }

    public async Task CopyActiveCell()
    {
        // Copies content from the currently active cell or selected range in the active worksheet.
        await SpreadsheetInstance.CopyCellAsync();
    }
}

Copy specific range in active sheet

To copy content from specific cells in the active worksheet, a cell address or a range of cell addresses must be provided as a parameter to the CopyCellAsync method. When a valid cell or range is specified, the Spreadsheet component copies the corresponding content and places it on the clipboard, making it available for pasting in another location.

The available parameters in the CopyCellAsync method are:

Parameter Type Description
cellAddress string (optional) Specifies the cell or range of cells to be copied. Accepts either a single cell reference from the active worksheet (for example, “A1”) or a range (for example, “A1:B5”). If no parameter is provided, the currently selected cell or range will be used for the copy operation. 
@using Syncfusion.Blazor.Spreadsheet

<button @onclick="CopyCell">Copy Cell</button>
<button @onclick="CopyRange">Copy Range </button>

<SfSpreadsheet @ref=SpreadsheetInstance DataSource="DataSourceBytes">
    <SpreadsheetRibbon></SpreadsheetRibbon>
</SfSpreadsheet>

@code {
    public byte[] DataSourceBytes { get; set; }
    public SfSpreadsheet SpreadsheetInstance;

    protected override void OnInitialized()
    {
        string filePath = "wwwroot/Sample.xlsx";
        DataSourceBytes = File.ReadAllBytes(filePath);
    }

    public async Task CopyCell()
    {
        // Copies the specified cell from the active worksheet.
        await SpreadsheetInstance.CopyCellAsync("A2"); 
    }

    public async Task CopyRange()
    {
        // Copies a specified range of cells from the active worksheet.
        await SpreadsheetInstance.CopyCellAsync("A1:D10");
    }
}

Copy specific range in different sheet

To copy content from a specific worksheet, the source sheet name must be included along with the cell reference in the parameter passed to the CopyCellAsync method. When specifying the sheet name, an exclamation mark (!) is used to separate it from the cell reference. The Spreadsheet component performs the copy operation and places the content on the clipboard, making it available for pasting into another location.

The available parameters in the CopyCellAsync method are:

Parameter Type Description
cellAddress string (optional) Specifies the cell or range of cells to be copied. Accepts either a single cell reference from a specific worksheet (for example, “Sheet1!A1”) or a range of cells (for example, “Sheet2!A1:C5”). If no value is provided, the currently selected cell or range from the active worksheet will be used for the copy operation. 
@using Syncfusion.Blazor.Spreadsheet

<button @onclick="CopyCellFromSpecificSheet">Copy Cell from Specific Sheet</button>
<button @onclick="CopyRangeFromSpecificSheet">Copy Range from Specific Sheet</button>

<SfSpreadsheet @ref=SpreadsheetInstance DataSource="DataSourceBytes">
    <SpreadsheetRibbon></SpreadsheetRibbon>
</SfSpreadsheet>

@code {
    public byte[] DataSourceBytes { get; set; }
    public SfSpreadsheet SpreadsheetInstance;

    protected override void OnInitialized()
    {
        string filePath = "wwwroot/Sample.xlsx";
        DataSourceBytes = File.ReadAllBytes(filePath);
    }

    public async Task CopyCellFromSpecificSheet()
    {
        // The cell address, including the sheet name, is copied from the specified worksheet.
        await SpreadsheetInstance.CopyCellAsync("Sheet1!B2");
    }

    public async Task CopyRangeFromSpecificSheet()
    {
        // Copies a specified range of cells from the designated worksheet.
        await SpreadsheetInstance.CopyCellAsync("Sheet2!B3:E8");
    }
}

Paste

The paste operation inserts data from the clipboard into a selected range of cells, rows, or columns, retaining all relevant details such as values, formats, and styles. When performing a Cut followed by Paste, the clipboard is cleared after the data is transferred. In contrast, with a Copy followed by Paste, the clipboard contents remain available for reuse.

External clipboard support allows pasting content from external sources like Google Sheets, Microsoft Excel, text files, and web pages.

Paste operations via UI

The paste operation can be performed through the UI using one of the following methods:

Using the Ribbon

  • A cell must be selected or a range of cells highlighted before initiating the paste operation.
  • The Paste button located in the Home tab of the Ribbon toolbar must be clicked to perform the paste action.
  • The values previously cut or copied from the clipboard will be inserted into the selected range.
  • The Paste option is disabled if the clipboard is empty.

Paste - Ribbon

Using the Context Menu

  • A cell must be clicked or a range of cells selected before initiating the paste operation.
  • The Paste option must be selected from the context menu accessed via right-click.
  • The values previously cut or copied from the clipboard will be inserted into the selected range.
  • The Paste option is disabled if the clipboard is empty.

Paste - Context Menu

Paste operations programmatically

The PasteCellAsync method pastes clipboard content into a specified cell or range, preserving all properties (value, format, style, etc.). If the source range is larger than the target range, the paste operation extends beyond the target’s boundaries to accommodate the full source content, overwriting any data in the expanded area.

Example

  • Source Range: “Sheet1!A1:C3” (3 rows × 3 columns)
  • Target Range: “Sheet2!B2” (single cell)

Pasting this content will overwrite the range “Sheet2!B2:D4” to match the 3×3 source content.

The Paste operation will not be executed if invalid or out-of-boundary cell ranges are specified. All cell addresses must fall within the valid boundaries of the worksheet to ensure successful execution of the paste action.

Paste to active range

When PasteCellAsync is invoked without parameters, the content is pasted into the last selected range. If no range is selected, the content is pasted into the active cell.

@using Syncfusion.Blazor.Spreadsheet

<button @onclick="PasteActiveCell">Paste to Active Cell</button>

<SfSpreadsheet @ref=SpreadsheetInstance DataSource="DataSourceBytes">
    <SpreadsheetRibbon></SpreadsheetRibbon>
</SfSpreadsheet>

@code {
    public byte[] DataSourceBytes { get; set; }
    public SfSpreadsheet SpreadsheetInstance;

    protected override void OnInitialized()
    {
        string filePath = "wwwroot/Sample.xlsx";
        DataSourceBytes = File.ReadAllBytes(filePath);
    }

    public async Task PasteActiveCell()
    {
        // Pastes the content into the currently active cell or range.
        await SpreadsheetInstance.PasteCellAsync();
    }
}

Paste to specific range in active sheet

To paste content into a specific range in the active sheet, provide the target cell address or range as a parameter to the PasteCellAsync method. A valid cell selection must exist prior to executing the paste operation. Either a single cell or a range of cells can be specified as the destination.

The available parameters in the PasteCellAsync method are:

Parameter Type Description
cellAddress string (optional) Specifies the target cell or range of cells for pasting clipboard content. Accepts either a single cell reference (for example, “A1”) or a range of cells (for example, “A1:B5”) from the active worksheet. A valid cell selection must exist prior to executing the paste operation. If no parameter is provided, the currently selected cell or range will be used as the paste destination. 
@using Syncfusion.Blazor.Spreadsheet

<button @onclick="PasteCell">Paste Cell</button>
<button @onclick="PasteRange">Paste Range</button>
<button @onclick="CopyAndPasteOversizedRange">Copy and Paste Oversized Range</button>

<SfSpreadsheet @ref=SpreadsheetInstance DataSource="DataSourceBytes">
    <SpreadsheetRibbon></SpreadsheetRibbon>
</SfSpreadsheet>

@code {
    public byte[] DataSourceBytes { get; set; }
    public SfSpreadsheet SpreadsheetInstance;

    protected override void OnInitialized()
    {
        string filePath = "wwwroot/Sample.xlsx";
        DataSourceBytes = File.ReadAllBytes(filePath);
    }

    public async Task PasteCell()
    {
        // Pastes the clipboard content into the specified cell.
        await SpreadsheetInstance.PasteCellAsync("A2"); 
    }

    public async Task PasteRange()
    {
       // Pastes the clipboard content into the specified range of cells.
        await SpreadsheetInstance.PasteCellAsync("A2:B5"); 
    }
    
    // A larger source range is copied and pasted into a smaller target range.
    public async Task CopyAndPasteOversizedRange()
    {
        // A range containing 7 rows is copied from the source.
        await SpreadsheetInstance.CopyCellAsync("F3:F9");
        
        // The content is pasted into a smaller 3-row target range. All 7 rows will be pasted, extending beyond the specified range.
        await SpreadsheetInstance.PasteCellAsync("A5:A7");
    }
}

Paste to specific range in different sheet

To paste content into a specific sheet, include the target sheet name along with the cell reference as a parameter to the PasteCellAsync method. When specifying a sheet name, use an exclamation mark (!) to separate it from the cell reference.

The available parameters in the PasteCellAsync method are:

Parameter Type Description
cellAddress string (optional) Specifies the target cell or range of cells for pasting clipboard content. Accepts either a single cell reference from a specific worksheet (for example, “Sheet1!A1”) or a range of cells (for example, “Sheet2!A1:C5”). A valid cell selection must exist before executing the paste operation. If no parameter is provided, the currently selected cell or range will be used as the paste destination. 
@using Syncfusion.Blazor.Spreadsheet

<button @onclick="PasteCellToTargetSheet">Paste</button>

<SfSpreadsheet @ref=SpreadsheetInstance DataSource="DataSourceBytes">
    <SpreadsheetRibbon></SpreadsheetRibbon>
</SfSpreadsheet>

@code {
    public byte[] DataSourceBytes { get; set; }
    public SfSpreadsheet SpreadsheetInstance;

    protected override void OnInitialized()
    {
        string filePath = "wwwroot/Sample.xlsx";
        DataSourceBytes = File.ReadAllBytes(filePath);
    }

    public async Task PasteCellToTargetSheet()
    {
        // The cell address, including the sheet name, is used as the paste destination.
        await SpreadsheetInstance.PasteCellAsync("Sheet1!B2");
    }    
}

Events

The Blazor Spreadsheet provides events that trigger during clipboard actions: CutCopyActionBegin and Pasting. These events allow for validation, customization, and other custom actions before the clipboard operation is executed.

  • CutCopyActionBegin - CutCopyActionBegin event is triggered before a cut or copy operation is initiated.
  • Pasting - Pasting event is triggered prior to the initiation of a paste operation.

CutCopyActionBegin

The CutCopyActionBegin event is triggered before a copy or cut operation is performed in the spreadsheet. This event allows inspection, validation, or cancellation of the operation based on custom business logic.

Purpose

This event is useful for monitoring clipboard activities, preventing sensitive data from being copied, validating operations, or selectively restricting cut and copy actions based on custom logic.

Event Arguments

CutCopyActionBeginEventArgs includes the following properties:

Event Arguments Description
ClipboardAction Specifies the type of clipboard operation in progress. Returns a value from the ClipboardAction enumeration, such as ClipboardAction.Cut or ClipboardAction.Copy.
CopiedRange Represents the full address of the cell range involved in the clipboard operation. Includes the worksheet name and range in A1 notation (e.g., “Sheet1!A1:B5”).
Cancel Indicates whether the clipboard operation should be cancelled. Set to true to prevent the cut or copy action from proceeding. 
@using Syncfusion.Blazor.Spreadsheet

<SfSpreadsheet DataSource="DataSourceBytes" CutCopyActionBegin="OnCutCopyActionBegin">
    <SpreadsheetRibbon></SpreadsheetRibbon>
</SfSpreadsheet>
 
@code {
    public byte[] DataSourceBytes { get; set; }
    
    protected override void OnInitialized()
    {
        string filePath = "wwwroot/Sample.xlsx";
        DataSourceBytes = File.ReadAllBytes(filePath);
    }

    public void OnCutCopyActionBegin(CutCopyActionBeginEventArgs args)
    {
        // Cancels any cut or copy operation.
        args.Cancel = true;
    }
}

Pasting

The Pasting event is triggered before data is pasted into the spreadsheet. This event allows inspection and validation of the paste operation before it is completed, with options to modify or cancel the operation entirely.

Purpose

This event is applicable in scenarios that require control over paste operations, such as validating data before allowing paste actions, restricting paste functionality to specific worksheets or cell ranges, applying data transformation rules during paste execution, and enforcing data integrity through oversight of paste operations.

Event Arguments

PastingEventArgs includes the following properties:

Event Arguments Description
ExternalClipboardData An array of strings containing raw text data from external sources (like Excel or Google Sheets), with each element representing a row of data. Set to null when copying from within the workbook.
CopiedRange A string in the format “SheetName!Range” (e.g., “Sheet1!A1:A10”) representing the source location of the copied or cut content. Set to null when pasting external content.
PasteRange A string in the format “SheetName!Range” specifying the target cell range where content will be pasted.
Cancel A boolean value that can be set to true to prevent the paste operation, allowing event handlers to control the paste behavior. The default value is false. 
@using Syncfusion.Blazor.Spreadsheet

<SfSpreadsheet DataSource="DataSourceBytes"Pasting="OnPasting">
    <SpreadsheetRibbon></SpreadsheetRibbon>
</SfSpreadsheet>
 
@code {
    public byte[] DataSourceBytes { get; set; }   

    protected override void OnInitialized()
    {
        string filePath = "wwwroot/Sample.xlsx";
        DataSourceBytes = File.ReadAllBytes(filePath);
    }

    public void OnPasting(PastingEventArgs args)
    {
        // Cancels the paste operation if the target range includes "A1:B5".
        if (args.PasteRange.Contains("A1:B5"))
        {
            args.Cancel = true;
        }

        // Checks external clipboard data for restricted content.
        if (args.ExternalClipboardData != null)
        {
            foreach (var line in args.ExternalClipboardData)
            {
                if (line.Contains("Confidential"))
                {
                    args.Cancel = true;
                    break;
                }
            }
        }
    }
}