-
Data Grids / Data Management
-
Data Grid
- Overview
-
Data Binding
-
Filtering
- Sorting
-
Editing
-
Grouping
-
Selection
- Focused Row
- Paging
-
Scrolling
-
Columns
-
Master-Detail
-
Data Summaries
-
Drag & Drop
-
Export to PDF
-
Export to Excel
- Appearance
-
Customization
- State Persistence
-
Adaptability
-
Keyboard Navigation
- Right-To-Left Support
-
Tree List
- Overview
-
Data Binding
-
Filtering
- Sorting
-
Editing
-
Selection
- Focused Row
- Paging
-
Columns
- Drag & Drop
- State Persistence
- Adaptability
-
Keyboard Navigation
-
Card View
-
Pivot Grid
- Overview
-
Data Binding
-
Field Management
-
Data Summaries
- Drill Down
- Filtering
-
Scrolling
-
Export to Excel
- Chart Integration
- Customization
- State Persistence
-
Filter Builder
-
-
Data Visualization
-
Charts
- Overview
-
Data Binding
-
Common Concepts
-
Axis
-
Aggregation
-
Tooltips
-
Selection
-
Customization
-
Zooming
-
Export
-
-
Area Charts
-
Bar Charts
- Bullet Charts
-
Doughnut Charts
-
Financial Charts
-
Funnel and Pyramid Charts
-
Line Charts
- Pareto Chart
-
Pie Charts
-
Point Charts
-
Polar and Radar Charts
-
Range Charts
- Sankey Chart
-
Sparkline Charts
-
Tree Map
-
Gauges
- Overview
-
Runtime update
-
Bar Gauge
-
Circular Gauge
-
Linear Gauge
-
Diagram
- Overview
-
Data Binding
-
Featured Shapes
-
Custom Shapes
-
Document Capabilities
-
User Interaction
- UI Customization
- Adaptability
-
-
Scheduling / Planning
-
Scheduler
- Overview
-
Data Binding
-
Views
-
Appointments
-
Timetable
- Editing
-
Grouping
- Virtual Scrolling
- Drag & Drop
-
Customization
- Adaptability
-
Gantt
- Overview
- Data Binding
-
Filtering
- Sorting
- Strip Lines
- Export to PDF
- Validation
-
Customization
-
-
Reporting
-
AI-powered Extensions
-
Interaction
-
Report Types
-
Data binding
-
Real-life Reports
-
Layout Features
-
Report Controls
-
Web-specific Features
-
-
Rich Text Editor
- Overview
- Load/Save
- Document Protection
-
Templates
- Autocorrect
-
Customization
- Simple View
-
Spreadsheet
- Overview
-
Open a Document
- Export And Printing
-
Features
-
UI Customization
-
Messaging
-
WYSIWYG Editor
-
Forms
-
Data Editors
- Overview
-
Common Concepts
-
Calendar
- Check Box
- Color Box
- Date Box
-
Date Range Box
-
Number Box
- Radio Group
-
Range Selector
- Range Slider
- Slider
- Switch
- Text Area
- Text Box
-
Drop-Downs
- Autocomplete
-
Drop Down Box
-
Select Box
-
Tag Box
-
Lookup
-
Buttons
-
File Upload / File Management
-
File Manager
- Overview
-
File System Types
-
Customization
-
File Uploader
-
-
Popup and Notifications
-
Navigation
- Overview
- Accordion
-
Context Menu
-
Menu
- Multi View
-
Drawer
-
Tab Panel
-
Tabs
-
Toolbar
-
Stepper
- Pagination
-
List
-
Tree View
- Right-to-Left Support
-
Layout
-
Tile View
- Splitter
-
Gallery
- Scroll View
-
-
Interactive Wrappers
-
Sortable
- Resizable
-
-
Progress Indicators
-
Maps
- Overview
-
Map
-
Vector Map
-
Data Binding
- Multiple Layers
-
Markers
- Legend
-
Zooming and Panning
-
Customization
-
-
Localization
Related Demos:
Your search did not match any results.
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);
}