Rich Edit - Document Protection

Our ASP.NET Rich Text Editor allows users to open and view protected documents. It also allows you to identify the current user, and enable a permitted range for a specified user or group.

In this demo, the Review ribbon tab contains custom commands that allow users to protect and unprotect the document (use the password "123"), switch between users to edit different text ranges, and customize or disable highlighting. The document includes permitted ranges for four users identified by user name: each user is authorized to edit a separate text region. The enabled range for the current user is highlighted.

Ribbon commands use the following APIs to execute appropriate actions:

protect and unprotect methods allow you to enable and disable document protection.
The authenticationOptions property authenticates the current user by name or user group name.
The rangePermissionOptions define visualization settings used to highlight permitted ranges.

Backend API

<script src="~/DemosScripts/documentProtection.js"></script> @(Html.DevExpress().RichEdit("DemoRichEdit") .Open("Documents/DocumentProtection.docx") .Ribbon(r => r .Tabs(tabs => { tabs.Add("Review") .Items(items => { items.AddButton() .Text("Protect Document") .CommandName("protectDocument") .ShowText(true) .Icon("dxre-icon-ProtectDocument"); items.AddButton() .Text("Unprotect Document") .CommandName("unprotectDocument") .ShowText(true) .Icon("dxre-icon-UnprotectDocument"); items.AddSelectBox() .Width(280) .BeginGroup(true) .CommandName("user") .Value("lawyer@somecompany.com") .ShowClearButton(true) .Placeholder("Select user") .Items(i => i .Add("lawyer@somecompany.com", "lawyer@somecompany.com") .Add("projectmanager@somecompany.com", "projectmanager@somecompany.com") .Add("senior@somecompany.com", "senior@somecompany.com") .Add("novice@somecompany.com", "novice@somecompany.com") ); items.AddToggleButton(true) .BeginGroup(true) .CommandName("highlightRanges") .Text("Highlight Ranges"); items.AddColorBox() .CommandName("highlightColor") .Color("rgb(150, 200, 150)"); items.AddToggleButton(true) .BeginGroup(true) .CommandName("showBrackets") .Text("Show Brackets"); items.AddColorBox() .CommandName("bracketsColor") .Color("rgb(127, 127, 127)"); }); }) .ActiveTabIndex(7) ) .OnDocumentLoaded("onDocumentLoaded") .OnCustomCommandExecuted("onCustomCommandExecuted") .Authentication(a => a.UserName("lawyer@somecompany.com")) .Height(600) .ConfirmOnLosingChanges(c => c.Enabled(false)) )

using Microsoft.AspNetCore.Mvc; namespace AspNetCoreDemos.RichEdit { [Route("[action]")] public class RichEditController : Controller { public IActionResult DocumentProtection() { return View(); } } }

var protectDocumentCommandId = 'protectDocument'; var unprotectDocumentCommandId = 'unprotectDocument'; function onCustomCommandExecuted(s, e) { switch (e.commandName) { case protectDocumentCommandId: if (!s.document.isProtected) { const password = window.prompt('enter new password(optional):', ''); if (password != undefined && password != null) s.document.protect(password); } updateCommandsState(s); break; case unprotectDocumentCommandId: const password = window.prompt('enter password:', ''); if (password != undefined && password != null) { if (s.document.checkProtectionPassword(password)) s.document.unprotect(); else window.alert('The password incorrect!'); } updateCommandsState(s); break; case 'user': s.authenticationOptions.userName = e.parameter ?? ''; break; case 'highlightRanges': s.rangePermissionOptions.highlightRanges = e.parameter; break; case 'showBrackets': s.rangePermissionOptions.showBrackets = e.parameter; break; case 'highlightColor': s.rangePermissionOptions.highlightColor = e.parameter; break; case 'bracketsColor': s.rangePermissionOptions.bracketsColor = e.parameter; break; } } function onDocumentLoaded(s, e) { updateCommandsState(s); } function updateCommandsState(rich) { rich.setCommandEnabled(protectDocumentCommandId, !rich.document.isProtected); rich.setCommandEnabled(unprotectDocumentCommandId, rich.document.isProtected); }