Office-Inspired Web UI Controls — Tips and Tricks (October 2022)

This post includes links to a series of interesting support tickets, new GitHub code examples, and newly created help topics. We hope you find the contents of this post of business value. If you have any questions about a specific support ticket, feel free to post a comment in the DevExpress Support Center.

Documentation Updates

We added a new Document Management section to the ASP.NET Core Spreadsheet control's help file. This section includes task-based topics for our ASP.NET Core MVC Spreadsheet control:

• Create a Document
• Open a Document
• Share a Document
• Save a Document
• Close a Document
• Hibernate a Document

New GitHub Examples

We published new examples designed to address popular usage scenarios for our Blazor Rich Text Editor UI component:

• How to use the component inside an EditForm
• How to export a document to a file (HTML format)
• How to implement custom document save capabilities

We also added a document management example for our ASP.NET Core Spreadsheet control,

• How to use AJAX requests to update document content

Interesting Support Tickets

Rich Text Editor for Blazor

• How to bind Rich Edit to an SQL database

  Retrieve a document as a byte array from a database and assign the array to the DocumentContent property to open a given document in the Rich Text Editor. If your database stores the document in a format other than DOCX, you should also assign the format to the DocumentFormat property.

  ExportDocumentAsync method overloads allow you to export an open document to a byte array (using the required file format). Export the document and write the result byte array back to the database to save pending changes.

• How to insert HTML or RTF text

• How to change the page size to A4

  Call a section's ChangePropertiesAsync method to change section properties:

  <DxRichEdit @ref="richEdit"/>
  
  @code {
      DxRichEdit richEdit;
      protected override async Task OnAfterRenderAsync(bool firstRender) {
          if (firstRender) {
              Document documentAPI = richEdit.DocumentAPI;
              var sections = await documentAPI.Sections.GetAllAsync();
              foreach (Section s in sections)
                  await s.ChangePropertiesAsync(properties => {
                      properties.PaperKind = System.Drawing.Printing.PaperKind.A4;
              });
          }
      }
  }

• How to use Rich Edit in an Accordion
• How to reuse code from XtraRichEdit to handle the CalculateDocumentVariable event

Office-Inspired Controls for Web Forms

• How to block header and footer editing in the Rich Text Editor
• How to secure MVC Spreadsheet access to a resource