# TX Text Control for Blazor: Mail Merge Integration Tutorial

> This tutorial shows how to integrate the TX Text Control MailMerge component into a Blazor application using the TX Text Control .NET Server.

- **Author:** Bjoern Meyer
- **Published:** 2025-03-25
- **Modified:** 2025-11-16
- **Description:** This tutorial shows how to integrate the TX Text Control MailMerge component into a Blazor application using the TX Text Control .NET Server.
- **4 min read** (738 words)
- **Tags:**
  - ASP.NET
  - ASP.NET Core
  - Blazor
  - Document Editor
  - Mail Merge
- **LLMs.txt URL:** https://www.textcontrol.com/blog/2025/03/25/tx-text-control-for-blazor-mail-merge-integration-tutorial/llms.txt
- **LLMs-full.txt URL:** https://www.textcontrol.com/blog/2025/03/25/tx-text-control-for-blazor-mail-merge-integration-tutorial/llms-full.txt
- **Canonical URL:** https://www.textcontrol.com/blog/2025/03/25/tx-text-control-for-blazor-mail-merge-integration-tutorial/
- **GitHub Repository:** https://github.com/TextControl/TXTextControl.Web.Blazor.MailMerge

---

The TX Text Control Document Editor Blazor packages use the *InteractiveServer* render mode. This rendering mode provides a seamless way to load documents that reside on the server. It also simplifies saving edited documents back to the server without requiring complex client-server synchronization.

This tutorial demonstrates how to combine Blazor calls - such as saving a document - with TX Text Control's server-side MailMerge functionality, enabling powerful document automation workflows in your Blazor applications.

The application, which can be downloaded from our GitHub repository, is based on the basic Getting Started tutorial. Use the link below to create such an application.

> **Getting Started**
> 
> This article shows how to integrate the Document Editor for Blazor into an ASP.NET Core application running on Windows and Linux. The Document Editor is a powerful word processing component that can be used to create, edit, and view documents in various formats.
> 
> [Getting Started: Document Editor for Blazor in ASP.NET Core ](https://www.textcontrol.com/blog/2025/03/25/getting-started-document-editor-for-blazor-in-asp-net-core/llms-full.txt)

The applications integrate the document editor into a page and provide various buttons to load and save the document, load a JSON file as a data source, and merge the document server-side. We will describe all of these processes step by step.

![TX Text Control for Blazor](https://s1-www.textcontrol.com/assets/dist/blog/2025/03/25/d/assets/blazor1.webp "TX Text Control for Blazor")

### Loading a Document

The first button loads a document directly from the server using server-side C# code. The document is located on the server in a folder named *Documents*.

The following Razor code shows the Document Editor component and its buttons.

```
@page "/"
@rendermode InteractiveServer

<PageTitle>Home</PageTitle>

<h1>Hello, Blazor!</h1>

<TXTextControl.Web.Blazor.DocumentEditor.DocumentEditor 
OnLoad="documentEditor_Load" 
@ref="_documentEditor" 
Width="800px" 
Height="500px" />

<button class="btn btn-primary mt-5" @onclick="ButtonLoad">
Load Document
</button>

<button class="btn btn-primary mt-5" @onclick="ButtonSave">
Save Document
</button>

<button class="btn btn-primary mt-5" onclick="loadJson()">
Load JSON Client-Side
</button>

<button class="btn btn-primary mt-5" @onclick="ButtonMerge">
Merge Template Server-Side
</button>
```

When the first button is clicked, it calls server-side C# code with a reference to the Document Editor (*\_documentEditor*).

```
@code {
private TXTextControl.Web.Blazor.DocumentEditor.DocumentEditor _documentEditor;

private async Task ButtonLoad() {
try
{
await _documentEditor.LoadDocumentAsync("Documents/template.docx",
TXTextControl.Web.StreamType.WordprocessingML);
}
catch (Exception ex)
{
Console.Error.WriteLine($"Error loading document: {ex.Message}");
}
}
}
```

### Saving a Document

In the same way, the document can also be stored on the server. The second button saves the document to the server using server-side C# code.

```
private async Task ButtonSave()
{
try
{
await _documentEditor.SaveDocumentAsync("Documents/output.docx",
TXTextControl.Web.StreamType.WordprocessingML);
}
catch (Exception ex)
{
Console.Error.WriteLine($"Error saving document: {ex.Message}");
}
}
```

### Loading a JSON Data Source

The third button loads a JSON data source from a Web API endpoint called *api/file*. This JSON file is then loaded into the Document Editor using JavaScript. The JavaScript API is required for certain operations, such as manipulating the document or responding to user interactions.

```
<script>
function loadJson() {
// call Web API controller and load json file
fetch('api/file')
.then(response => response.json())
.then(body => {
TXTextControl.loadJsonData(JSON.stringify(body));
})
.catch(error => {
console.error('Error:', error);
});
}
</script>
```

### Merging the Document

The fourth button merges the document with the JSON data source. The merge process is executed on the server using the MailMerge class.

```
private async Task ButtonMerge()
{
try
{
byte[] data;
var document = _documentEditor.SaveDocumentAsync(TXTextControl.Web.BinaryStreamType.InternalUnicodeFormat).Result;

using (TXTextControl.ServerTextControl serverTextControl = new TXTextControl.ServerTextControl())
{
serverTextControl.Create();
serverTextControl.Load(document, TXTextControl.BinaryStreamType.InternalUnicodeFormat);

TXTextControl.DocumentServer.MailMerge mailMerge = new TXTextControl.DocumentServer.MailMerge();
mailMerge.TextComponent = serverTextControl;

string jsonData = System.IO.File.ReadAllText("Documents/data.json");

mailMerge.MergeJsonData(jsonData);

serverTextControl.Save("Documents/merged.pdf", TXTextControl.StreamType.AdobePDF);
serverTextControl.Save(out data, TXTextControl.BinaryStreamType.InternalUnicodeFormat);

await _documentEditor.LoadDocumentAsync(data, TXTextControl.Web.BinaryStreamType.InternalUnicodeFormat);
}

}
catch (Exception ex)
{
Console.Error.WriteLine($"Error merging document: {ex.Message}");
}
}
```

As you can see in the code above, the *MailMerge* class is used directly in the Razor code with the data exported by the Document Editor reference object. The document is exported to PDF, saved to a separate file, and loaded back into the editor.

![TX Text Control for Blazor](https://s1-www.textcontrol.com/assets/dist/blog/2025/03/25/d/assets/blazor2.webp "TX Text Control for Blazor")

### Conclusion

Integrating the TX Text Control Document Editor into a Blazor application is a straightforward process. The server-side rendering mode provides a seamless way to load and save documents on the server. This tutorial demonstrates how to combine Blazor calls with TX Text Control's server-side mail merge functionality to enable powerful document automation workflows in your Blazor applications.

The full source code of the application is available on GitHub. You can download the project and run it on your local machine.

---

## About Bjoern Meyer

As CEO, Bjoern is the visionary behind our strategic direction and business development, bridging the gap between our customers and engineering teams. His deep passion for coding and web technologies drives the creation of innovative products. If you're at a tech conference, be sure to stop by our booth - you'll most likely meet Bjoern in person. With an advanced graduate degree (Dipl. Inf.) in Computer Science, specializing in AI, from the University of Bremen, Bjoern brings significant expertise to his role. In his spare time, Bjoern enjoys running, paragliding, mountain biking, and playing the piano.

- [LinkedIn](https://www.linkedin.com/in/bjoernmeyer/)
- [X](https://x.com/txbjoern)
- [GitHub](https://github.com/bjoerntx)

---

## Related Posts

- [Building an ASP.NET Core Backend (Linux and Windows) for the Document Editor and Viewer](https://www.textcontrol.com/blog/2025/03/26/building-an-asp-net-core-backend-for-the-document-editor-and-viewer/llms.txt)
- [TX Text Control Document Editor and Viewer for Blazor Released](https://www.textcontrol.com/blog/2025/03/25/tx-text-control-document-editor-and-viewer-for-blazor-released/llms.txt)
- [Getting Started: Document Editor for Blazor in ASP.NET Core](https://www.textcontrol.com/blog/2025/03/25/getting-started-document-editor-for-blazor-in-asp-net-core/llms.txt)
- [Announcing Our Work on a Blazor Component for Document Editing and Viewing](https://www.textcontrol.com/blog/2025/01/24/announcing-our-work-on-a-blazor-component-for-document-editing-and-viewing/llms.txt)
- [Introducing Text Control Agent Skills](https://www.textcontrol.com/blog/2026/03/27/introducing-text-control-agent-skills/llms.txt)
- [Deploying the TX Text Control Document Editor from the Private NuGet Feed to Azure App Services (Linux and Windows)](https://www.textcontrol.com/blog/2026/03/25/deploying-the-tx-text-control-document-editor-from-the-private-nuget-feed-to-azure-app-services-linux-and-windows/llms.txt)
- [Build a Custom Backstage View in ASP.NET Core with TX Text Control](https://www.textcontrol.com/blog/2026/02/17/build-a-custom-backstage-view-in-aspnet-core-with-tx-text-control/llms.txt)
- [ASP.NET Core Document Editor with Backend via the Text Control Private NuGet Feed](https://www.textcontrol.com/blog/2026/02/09/aspnet-core-document-editor-private-nuget-feed/llms.txt)
- [Why Document Processing Libraries Require a Document Editor](https://www.textcontrol.com/blog/2025/12/04/why-document-processing-libraries-require-a-document-editor/llms.txt)
- [Getting Started Video Tutorial: Document Editor in ASP.NET Core C# on Linux](https://www.textcontrol.com/blog/2025/07/29/getting-started-video-tutorial-document-editor-aspnet-core-csharp-linux/llms.txt)
- [E-Sign Comes to Blazor: Document Viewer 33.0.1 Released](https://www.textcontrol.com/blog/2025/04/24/e-sign-comes-to-blazor-document-viewer-33-0-1-released/llms.txt)
- [Deploying the TX Text Control Document Editor in an ASP.NET Core Web App to Azure App Services](https://www.textcontrol.com/blog/2025/03/26/deploying-the-tx-text-control-document-editor-in-an-asp-net-core-web-app-to-azure-app-services/llms.txt)
- [Getting Started: Document Viewer for Blazor in ASP.NET Core](https://www.textcontrol.com/blog/2025/03/25/getting-started-document-viewer-for-blazor-in-asp-net-core/llms.txt)
- [Introducing TXTextControl.Web.Server.Core: A Cross-Platform Backend for TX Text Control Document Editor](https://www.textcontrol.com/blog/2025/03/13/introducing-txtextcontrol-web-server-core-a-cross-platform-backend-for-tx-text-control-document-editor/llms.txt)
- [Getting Started: Document Editor with ASP.NET Core and Docker Support with Linux Containers](https://www.textcontrol.com/blog/2025/03/12/getting-started-document-editor-with-asp-net-core-and-docker-support-with-linux-containers/llms.txt)
- [Mail Merge: Skipping Records During the Merge Process in .NET C#](https://www.textcontrol.com/blog/2025/02/10/mail-merge-skipping-records-during-the-merge-process-in-net-c-sharp/llms.txt)
- [Mail Merge MS Word DOCX Documents and Convert to PDF in .NET C#](https://www.textcontrol.com/blog/2025/02/07/mail-merge-ms-word-docx-documents-and-convert-to-pdf-in-net-c-sharp/llms.txt)
- [Merging Self-Calculating Business Objects with TX Text Control MailMerge in C#](https://www.textcontrol.com/blog/2024/12/27/merging-self-calculating-business-objects-with-tx-text-control-mailmerge-in-csharp/llms.txt)
- [Preparing Documents for E-Signing for Multiple Signers in .NET C#](https://www.textcontrol.com/blog/2024/11/13/preparing-documents-for-e-signing-for-multiple-signers-in-net-c-sharp/llms.txt)
- [ASP.NET Core: Use the Document Editor and Viewer in the Same Razor View](https://www.textcontrol.com/blog/2024/11/08/asp-net-core-use-the-document-editor-and-viewer-in-the-same-razor-view/llms.txt)
- [Connecting the TXWebSocketMiddleware to a Separate, External TCP Synchronization Service](https://www.textcontrol.com/blog/2024/10/01/connecting-the-txwebsocketmiddleware-to-a-separate-external-tcp-synchronization-service/llms.txt)
- [Getting Started: Creating an ASP.NET Core Web App with the Document Editor in Visual Studio Code (VS Code)](https://www.textcontrol.com/blog/2024/09/27/getting-started-creating-an-asp-net-core-web-app-with-the-document-editor-in-visual-studio-code-vs-code/llms.txt)
- [Getting Started Video Tutorial: How to use the Document Editor in ASP.NET Core C#](https://www.textcontrol.com/blog/2024/08/05/getting-started-video-tutorial-how-to-use-the-document-editor-in-asp-net-core-csharp/llms.txt)
- [Observe When the Reporting Preview Tab is Active Using MutationObserver](https://www.textcontrol.com/blog/2024/07/23/observe-when-the-reporting-preview-tab-is-active-using-mutationobserver/llms.txt)
- [ASP.NET Core: Loading Documents in the Document Editor](https://www.textcontrol.com/blog/2024/04/15/asp-net-core-how-to-load-a-document-in-the-document-editor/llms.txt)