Skip to content

Commit f9061c4

Browse files
991223: Blazor Documentation cleanup
1 parent db8aeb3 commit f9061c4

File tree

1 file changed

+14
-3
lines changed

1 file changed

+14
-3
lines changed

blazor/rich-text-editor/smart-editing/mail-merge.md

Lines changed: 14 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,28 @@
11
---
22
layout: post
33
title: Mail merge in Blazor RichTextEditor | Syncfusion
4-
description: Checkout and learn here all about Mail merge in Syncfusion Blazor RichTextEditor component and much more.
4+
description: Checkout and learn here all about Mail merge in Syncfusion Blazor RichTextEditor control and much more.
55
platform: Blazor
66
control: RichTextEditor
77
documentation: ug
88
---
99

1010
# Mail merge in Blazor Rich Text Editor Control
1111

12-
The Rich Text Editor can be customized to implement **Mail Merge** functionality by inserting placeholders into the editor using custom toolbar items. These placeholders are later replaced with actual data to generate personalized content such as letters, invoices, and reports.
12+
The **Mail Merge** feature in Syncfusion Blazor Rich Text Editor enables you to create dynamic, personalized documents by inserting placeholders (merge fields) into the editor content. These placeholders are later replaced with actual data at runtime, making it ideal for generating letters, invoices, and bulk communication templates. Instead of manually editing each document, you can design a single template and populate it with user-specific data automatically.
1313

14-
This feature simplifies the creation of dynamic documents by allowing users to insert merge fields that are automatically populated with real data during content generation.
14+
To achieve this, the Rich Text Editor is customized with **custom toolbar items** and integrated with the **Mention control**. The toolbar provides two key options:
15+
- **Insert Field**: A dropdown menu that allows users to insert predefined merge fields like `{{FirstName}}` or `{{Email}}` into the editor.
16+
- **Merge Data**: A button that triggers the process of replacing all placeholders in the editor with actual values from a data source (e.g., a dictionary or database).
17+
18+
The Mention control enhances usability by enabling users to type a special character (like `{`) and select merge fields from a popup list. This combination of toolbar customization and mention functionality makes the editor highly interactive and suitable for mail merge scenarios.
19+
20+
## How Custom Toolbar Items Work
21+
22+
Custom toolbar items are added using the `RichTextEditorCustomToolbarItems` tag inside the editor. Each item is defined with a **Name** and a **Template**. The template can include any Blazor control, such as a button or dropdown. Event handlers like `OnClickHandler` and `OnItemSelect` are used to perform actions when these items are clicked or selected.
23+
24+
- **Merge Data Button**: Executes the `OnClickHandler` method, which retrieves the editor content and replaces placeholders using a regex-based function.
25+
- **Insert Field Dropdown**: Displays a list of merge fields. When a field is selected, the `OnItemSelect` method inserts the corresponding placeholder into the editor at the current cursor position.
1526

1627
{% highlight cshtml %}
1728

0 commit comments

Comments
 (0)