What’s New in v21.1
DataGrid
Export to PDF
Our Export to PDF API now includes the following options/capabilities:
- WISIWYG Export to PDF
- Fit-to-page
- Multi-Page Export
- Text Wrapping
- Progress Indication
- Cell Content, Format, and Appearance Customization options
Data Grid & Tree List
Pager Enhancements
v21.1 includes the following pager-related enhancements:
- A new pager.displayMode property. This property specifies the pager's display layout: full, compact, or adaptive.
- Our page size selector can now display 'All' records on a page (pager.allowedPageSizes).
Editing API Enhancements
You can now use declarative bindings to insert new rows in Angular, React, and Vue applications.
Add New Rows to a Specified Position (CTP)
You can now insert a new row at any location within a list (first, last, or a custom position).
Diagram
Get a Diagram Shape or Connector by ID or Key
This release allows you to obtain a diagram shape or connector by its internal identifier (getItemById) or by a data key (getItemByKey).
New shape properties include information about containers:
- containerChildItemIds - Gets shape identifiers within a container.
- containerExpanded - Gets whether a container is expanded.
- containerId - Gets the container identifier with a shape.
Iterate through Diagram Shapes and Connectors
Use our new getItems method to obtain an array of all diagram items (shapes and connectors).
Select Shapes and Connectors
v21.1 includes the following API enhancements:
- getSelectedItems - Returns selected diagram shapes and connectors.
- setSelectedItems - Selects specified diagram shapes and connectors.
Scroll to Item
Use the new scrollToItem method to scroll the drawing canvas to the specified diagram item.
ES6 Modules
DevExtreme's npm distribution now includes ES6 modules. These modules help optimize Tree Shaking and decrease production JS bundle size. Our internal tests demonstrate a 15-25% bundle size reduction.
With this update, you can also use modern JS bundlers that don't support the CommonJS module format and only work with ES6 modules.
File Manager
Customize a Context Menu for Individual Files/Folders
Our new onContextMenuShowing event allows you to customize your app's context menu for individual files and folders. You can add/remove menu items, specify item state, etc.
Describe Errors on the Client
The File Manager's API includes a new FileSystemError class. This class allows you to specify an error code (errorCode), error description (errorText), and file system element (fileSystemItem) when handling errors within 'CustomFileSystemProvider'.
Show/Hide Progress Panel
Use our new showPanel and showPopup options to display a progress panel and pop-up notifications within the File Manager.
Custom HTTP Headers in Remote File System Provider
You can now customize Ajax (beforeAjaxSend) and form submit requests (beforeSubmit) before they are sent to the server.
Gantt
API Enhancements
v21.1 includes the following Gantt related API updates:
- scrollToDate – Scrolls the Gantt chart to a specified date on a timeline.
- resourceManagerDialogShowing - Allows you to customize the Resource Manager dialog.
- taskContentTemplate – Allows you to customize the layout and appearance of individual task elements.
HTML/Markdown Editor
v21.1 marks the official release of our HTML/Markdown Editor. The DevExpress HTML/Markdown Editor includes the following integrated features:
- Inline, Block, and Embedded Format Support (Run Demo)
- Format Customization (Documentation)
- Custom Modules (Documentation)
- HTML and Markdown Support (Run Demo)
- Insert Image (a link or base64-encoded string) Support (Run Demo)
- Mail Merge Support
- Copy-Paste Rich Content Support
- Mentions (Run Demo)
- Multiline Toolbar
- Table Support (Run Demo)
- Localization
Scheduler
Scheduler
Our redesigned Agenda View now displays resources and a recurrence indicator for recurring appointments. Color markers help users differentiate appointments by resource.
Horizontal Virtual Scrolling
Horizontal Virtual Scrolling is now available across all Scheduler Views. When virtual scrolling is enabled, the Scheduler only renders grid cells and appointments that fall into the visible viewport.
Drag-and-Drop Enhancements
Drag&drop is now more intuitive and event positioning more predictable.
TypeScript Enhancements
DevExtreme v21.1 includes the following TypeScript related enhancements:
- DevExtreme modules no longer contain JQuery types if JQuery is not used in your target project.
- You can now use named types for event arguments within your application code.
- Event argument types now contain information about optional properties (that can be undefined) and writable properties (that can be modified in your event handlers).