The powerful DevExpress ASP.NET Spreadsheet control is now available for our ASP.NET Bootstrap set of controls.

Preview

This control is available as a preview version in the v18.2 release. However, it supports nearly all major features, including the new Pivot Tables.

It's a preview version because we're working to improve the new Spreadsheet's performance, Touch UI and Mobile experience, and add several minor dialogs. In fact, we'll likely release these features in a future v18.2 minor release.

Let's take a look at some of the advantages of this new Spreadsheet control.

Appearance

Like other DevExpress ASP.NET Bootstrap controls, the new Spreadsheet control will work with nearly any Bootstrap theme. The control's appearance is set through the Bootstrap.css file so it will look great in all Bootstrap-based apps.

The new Spreadsheet control also supports the excellent new DevExpress Bootstrap themes:

Adaptive

The Spreadsheet also makes use of a new adaptive ribbon control that adjusts its items based on the screen size:

Features

Even though this is a preview version, the Spreadsheet control is packed with the following major features:

• Charting
• Formulas
• Comments
• Protection
• Images
• Printing
• Worksheet Display Area
• Freeze Panes
• Sorting and AutoFilter
• Data Validation
• Mail Merging
• Extensive UI options: dialogs, context menu, ribbon;
• Client-side and Server-side API

Feedback

Take a look at the online demo and documentation:

• Demo
• Documentation

Then test the new DevExpress Bootstrap Spreadsheet control in your Bootstrap web apps and give us your feedback.

We've added an improvement to the DevExpress ASP.NET Bootstrap controls that will boost the performance of page rendering. Let's take a look.

Deferred Client Object Initialization

When a control is first loaded, it also needs to load its client-side scripts. This can either be done by using:

• a script resource reference tag (eg <script id="dxis\_%id%" type="text/javascript" \>) or
• an inline JavaScript snippet (a startup script block)

In either scenario, the browser will pause as it loads and executes the script. In fact, if it's an external JavaScript file then you'll need a few more milliseconds to fetch the script from disk, cache, or remote server.

These types of script blocks affect your page rendering performance. So, we've added a couple of ways that help you deal with script loading and, subsequently, improve the overall performance.

Async

With the latest release, the script resource references are rendered as script blocks with the useful async attribute:

<script id="dxis\_%id%" type="text/javascript" async\>

The Async attribute allows the script resources to load asynchronously, therefore in parallel to page loading. This helps your page rendering times because the page will continue to display/render the content for the end-user without waiting for the scripts to finish loading.

Delayed

However, startup scripts will not use the Async attribute because they can be completely delayed until the end of the of the page. Therefore, startup scripts are treated as delayed initialize blocks and executed after all related script resources are loaded.

We've added the new allowClientObjectDeferredInitialization option for this specific purpose.

Performance

Let's take a look at how the new improvements perform in Google Chrome. For the tests below, we use the DevExpress ASP.NET Bootstrap Navigation Demo demo page.

First, let's take a look at the performance without the improvements:

allowClientObjectDeferredInitialization = false

Google Chrome Lighthouse audit (desktop, performance test, no throttling)

Google Chrome Network stats

Now, let's take a look at with the new improvements:

allowClientObjectDeferredInitialization = true

Google Chrome Lighthouse audit (desktop, performance test, no throttling)

Google Chrome Network stats

The network statistics tab shows that the page does not wait for script resource to finish loading (the blue vertical line indicates the DOMContentLoaded event raise timestamp, the red one - window load event raise timestamp).

Take a look at the specific lines with the option disabled and enabled:

allowClientObjectDeferredInitialization = false

allowClientObjectDeferredInitialization = true

The new script loading option speeds up page load times and therefore, allows your end-users to start interacting with the page sooner.

Async & Client-side API

Good news, our client-side static API is still available for developers even if the deferred client object initialization is enabled.

You can use global events to track the control's initialization:

<script type="text/javascript"\>
    function onButtonInit(s, e) {
            console.log(s.GetMainElement().id, "from control init");
        }</script><dx:BootstrapButtonID="BootstrapButton1"runat="server"AutoPostBack="false"Text="Button"ClientInstanceName="btn1"\><ClientSideEventsInit="onButtonInit"/\></dx:BootstrapButton\><scripttype="text/javascript"\>
    ASPxClientControl.GetControlCollection().ControlsInitialized.AddHandler(function(s, e) {
        console.log(btn1.GetMainElement().id, "from global init handler");
        });</script\>

The attached handler will be executed after all other scripts are loaded and executed, and the controls are initialized.

Warning

Please note, there may be JavaScript errors when accessing or modifying our controls from a script loaded afterward or in the jQuery $.ready() function.

To avoid this problem, please use the ASPxClientControlCollection.ControlsInitialized event to initialize all the required client-side scripts. This event is raised after all our controls are fully initialized and it's also the generally recommended way that you load your custom scripts. Take a look at the How to ensure that controls are initialized on the client side example to see how to use this event.

Old Style

By default, the new allowClientObjectDeferredInitialization will be set to true. However, if for some reason you'd prefer to use the old approach, then set allowClientObjectDeferredInitialization to false:

<configuration\>
  ...<devExpress\>
        ...<bootstrap allowClientObjectDeferredInitialization="false" /\>
        ...</devExpress\></configuration\>

Also, please make sure that the bootstrap section is defined in the web.config:

<configuration\><configSections\><sectionGroupname="devExpress"\>
        ...<sectionname="bootstrap" type="DevExpress.Web.Bootstrap.BootstrapConfigurationSection, DevExpress.Web.Bootstrap.v18.2, Version=18.2.3.0, Culture=neutral, PublicKeyToken=b88d1754d700e49a" requirePermission="false"/\></sectionGroup\></configSections\>
  ...</configuration\>

What are your thoughts on the new performance improvements of the DevExpress ASP.NET Bootstrap controls? Drop me a line below.

As a web developer these days, it's difficult to plan for the many different screen sizes that your website can be viewed on. That's why a site that's optimized and responsive makes for a more pleasant end-user experience.

To help you meet the needs of a modern website, we've created a new responsive ASP.NET web application project template. As you know, a project application template helps you to get started quickly by giving you a fully working, if content-free, application.

Our new template provides several great features including:

• Ready-made web application with DevExpress ASP.NET controls
• Responsive design
• Visual Studio integration
• Easy-to-use wizard UI
• Adaptive features of DevExpress ASP.NET Controls
• DevExpress themed (CSS rules) for standard text content

It also looks great on various screens sizes whether desktop, tablet, or mobile:

Let's take a deeper look into the new project template's design, layout elements, and pages.

Mobile-First

When we sat down to design the new project template, we mainly focused on providing responsive features. So after researching support tickets and customer feedback, we found that most customers are working on complex desktop-oriented applications development. However, traffic from mobile devices is increasing daily. That is why we decided to use the "mobile first" approach for this template:

The mobile-first approach is exactly as it sounds: designing for the smallest screen and working your way up. It is one of the best strategies to create either a responsive or adaptive design. -UXPin

With a responsive layout and DevExpress ASP.NET controls' adaptive features, our new template provides full functionality for desktop and mobile browsers. This helps you to develop complex business web applications for nearly any screen size.

Check out the online demo:

Scan this QR Code above to experience the demo in your mobile browser.

Appearance/Theme

By default, our new template uses the DevExpress ASP.NET Office365 theme, however, you can choose a different base color and font. To make it even easier, we've also prepared a set of predefined base colors and a list of several font-families to use with our template. Set your own base color and font using the wizard:

Layout Elements

Now, let's discuss the four main layout elements. The template's home page leverages several DevExpress ASP.NET controls to help build these base UI elements:

• Navigation Bar
• Sidebars
• Adaptive Toolbar
• Sticky Footer

This setup allows our template to provide for adaptive layouts. Later, we'll look into the four main pages: GridView, Scheduler, Article, and SignIn/Register.

Let's start with the layout elements:

Navigation Bar

A navigation bar (navbar) is a fixed-height toolbar at the top of a page. This template uses a "sticky" navbar - this element "sticks" to the top of the page and does not move when end users scroll the page.

The navigation bar contains:

• A hamburger button - collapses/expands a left sidebar
• An image with the company's logo and title. Only the logo is displayed on mobile devices
• A responsive menu that transforms into a button on devices with narrow screens. When this button is clicked, menu items are displayed in a popup window
• A Sign In button that displays a popup window when clicked. The window displays the Sign In/Register buttons or the user's profile
• An additional hamburger button that, when clicked, collapses/expands the right sidebar (shown only for the GridView page)

The main menu also collapses on small screens to provide for a better end-user experience.

Sidebars - Collapsible Panels

A sidebar is a collapsible panel that displays additional UI elements on the page's left or right side. In this template, the sidebars are automatically collapsed. End users can click the hamburger button to invoke a sidebar on a mobile device:

The Home, GridView, Scheduler, and Article pages include a left sidebar. The GridView page also includes a right sidebar.

Sticky Top Toolbar

The GridView and Scheduler pages include a toolbar under the navbar. Use this toolbar as a container for UI elements that should be attached to the top of the page.

The toolbar provides two adaptive modes:

• the menu hides items' text and displays only icons
• the menu hides its items, one-by-one, to the popup menu. This popup menu is hidden under the ellipse button when the browser width is changed

Sticky Footer

A fixed-height footer is pinned to the bottom of either the browser window or the content pages when it’s height is greater than the window.

Adaptive Page Layout - Content

For the content, we had a key decision to make. You see there are two general concepts of embedding content inside an adaptive page layout:

1. Scrolling only a part of the page - the main content area can fit the special content area without overall page scrolling. When the browser window resizes, the content size is updated to fit the new area size. You can see this demonstrated for the Scheduler page in "Desktop" screen resolution:

2. Scrolling the whole page (with sticky elements) - the main content is still scrolled in the special content area. However, this is a more universal approach and can be used for several controls or text blocks placed one after another. For example, you can place a FormLayout, text blocks, grids, etc. When the special content area's height exceeds the screen height, then the page will display a vertical scroll bar (instead of only the special content area):

These days, the second approach is widely used in many 'real-world' (aka production) applications. Therefore, we decided to use this approach with our new responsive template too. Except, of course, for scenarios like the Scheduler page, where it makes sense to use the first approach.

Readability

To improve readability, we used special margins for the content. The size of these margins will adapt based on the screen size and provide for a better reading experience.

We designed a set of CSS rules for control block elements (HTML div elements: <div class="text-content" ...> and <div class="control-area-block">) that can be used for text or content placement.

For example, here are the divs wrapping the FormLayout control:

<asp:Content ID="Content5" ContentPlaceHolderID="PageContent" runat="server"><div class="text-content" runat="server" id="TextContent"><h1 class="title">Multiple Controls</h1><h2>Some Control</h2><div class="control-area-block"><dx:ASPxFormLayout runat="server" ID="ASPxFormLayout" Width="100%" ClientInstanceName="FormLayout">
            ...</dx:ASPxFormLayout></div><h2>Some Text</h2>
            ...</div></asp:Content>

Content Pages

There are four pages in this demo. Two of these use our powerful controls: the GridView and Scheduler pages positioned inside an adaptive layout.

GridView

The GridView page layout includes the following features:

• A collapsible search panel expanding under the toolbar. You can place custom filtering UI elements here:

• A left sidebar that incorporates a filtering interface
• Vertical and horizontal touch scrolling
• Data pagination and the control’s built-in pager
• An edit form implemented as an adaptive modal window

Scheduler

The Scheduler page’s layout includes the following features:

• A top fixed toolbar that stores filtering and exporting UI
• A built-in adaptive toolbar that allows end-users to switch dates and views
• A floating action button that provides fast access to event management

• A left sidebar that incorporates a calendar (implemented using the DateNavigator) and the resource filtering interface (implemented using the ListBox)

Article

The Article page demonstrates an adaptive reader for formatted texts. The page's layout is built using CSS styles and adapted for the browser's window size: margins and images are reduced for small screens. CSS styles applied to the Article page are stored in a separate file (Content.css) so that you can reuse them in other projects. This CSS file (Content.css) has a set of CSS rules that can be used to format your custom text content to a similar style used by our controls.

Learn more here: Article Page Demo

Printing CSS

Our CSS styles also contain settings to help improve printing by hiding unnecessary UI elements:

Login/Register Forms

We designed two forms to support authentication inside the template application. We used the FormLayout control for these forms to support adaptivity.

These forms can be extended to meet your requirements. They also support custom authentication logic that can be implemented in code-behind:

Authorized users can access their profiles by clicking on their photo in the top right corner:

If a user's photo is unavailable, the profile icon displays a user's initials:

Feedback

With this new template, we focused on combining adaptive layouts into a web application, yet still providing your end users with the functionality of a desktop app. We'd love to hear your feedback on the new template. Drop me a line below, thanks.

Though DevExpress offers more than 110 WebForms controls and more than 65 MVC extensions, we know we can always offer more... Since we cannot implement everything simultaneously, we need your feedback to shape product direction and plans in 2019.

Please take a moment and select one of the following products – what would you like to see us deliver in 2019 (feel free to leave a comment with specific usage-scenarios... the more you share, the better we can understand your business needs now and into the future):

Please Note: We will detail plans for existing ASP.NET WebForms and MVC components in a separate blog post.

Possible New ASP.NET Products

What would you like to see us deliver in 2019?

We're making plans for 2019 and we'd love to get your feedback. Help us determine the features you'd like to see for the DevExpress ASP.NET Scheduler and Office Controls.

Please take a moment and select a few of the following product features – what would you like to see us deliver in 2019 (feel free to leave a comment with specific usage-scenarios... the more you share, the better we can understand your business needs now and into the future):

Possible New 2019 Features

What would you like to see us deliver in 2019?

We're making plans for 2019 and we'd love to get your feedback. Help us determine the features you'd like to see for the DevExpress ASP.NET Data Grid, TreeList, CardView, and Vertical Grid controls.

Please take a moment and select a few of the following product features – what would you like to see us deliver in 2019 (feel free to leave a comment with specific usage-scenarios... the more you share, the better we can understand your business needs now and into the future):

Possible New 2019 Features

What would you like to see us deliver in 2019?

As you may know, last year we shipped several Bootstrap controls including our Scheduler, Spreadsheet, and Rich Text Editor. We are considering the following WebForms Boostrap controls for 2019 - your thoughts/feedback will go a long way in helping us shape our 2019 roadmap.

Pivot Grid

This control is used to reorganize and summarize selected data columns and rows in a spreadsheet or database table to obtain the desired report.

Filter Control

Allows end-users to create filter expressions for data obtained from a data source without using an explicit Where clause in the data source.

Floating Action Button

A new control we shipped in our v18.2 release cycle for WebForms and MVC components. The Floating Action button encapsulates the most popular end-user actions (e.g., CRUD operations, data sorting, filtering, etc.). Buttons are based upon current context, the control is fully customizable and it supports custom actions.

Responsive Project template

We recently released a new Responsive Project template for classic WebForms and MVC. We are now considering a Bootstrap equivalent. With this template, you’ll be able to create mobile-friendly applications based on DevExpress Bootstrap controls.

Our Bootstrap controls require some important enhancements. Since the DevExpress Bootstrap GridView is the most important component, we will be focused on its evolution in 2019.

GridView Client-side Render

Though Bootstrap GridView markup is much simpler than ‘classic’ ASPxGridView markup, the grid still renders on the server side. We want to rework the GridView and render its markup on the client side. This allows the GridView to perform certain operations on the client, improving overall GridView performance. We will certainly do our best to retain backward compatibility, but we do expect to introduce a few breaking changes as we move to client-side rendering.

Support Callbacks in GridView BatchEdit

At present, our Bootstrap GridView only supports batch edit on the current data. If an end-user wants to change values on different pages, he or she must update data on every page before editing values on another page. Once we support callbacks in Batch edit mode, end-users can edit values on any page and sort, filter grid data without losing changes. We’ll also add a new Preview mode to view changes made on different data pages.

Drop-down Editors Adaptivity

When an end-user opens a drop-down window on a mobile phone, the drop-down window automatically becomes a modal; it is aligned by the screen size. If you are using data editors with drop-down windows (ComboBox, DateEdit, etc.) in your project, this feature will help to make your application mobile friendly.

We wanted to thank everyone who voted in our 2019 Roadmap Survey. We value your feedback and thank you for sharing your thoughts with us. The following is a summary of our official 2019 roadmap.

Important Note: In nearly every instance, we selected features/products that received the highest vote count. In many instances, total votes for features that appear on this roadmap failed to break the 50% mark. This does not mean that the feature/product did not win the vote - it simply means that it received a plurality - not a majority.

Table of Content

WebForms and MVC

WebForms and MVC

New Controls

New Gantt control (v19.1)

This feature received 45% of the vote in our survey.

A stand-alone Filter Panel (v19.2)

This feature received 63% of the vote in our survey.

The panel can be directly bound to GridView, CardView, TreeList, or VerticalGrid.

Back to top

GridView

Batch Edit Mode improvements (v19.1 and v19.2)

This feature received 30% of the vote in our survey.

We want to provide a way to customize the default navigation order according to your business rules.

Currently, the endless paging is not compatible with Batch edit mode (it is one of the limitations). We plan to resolve this issue.

Many of our customers asked us about multiple cell selection that allows selecting cells like in Spreadsheet/Excel, copy and paste their values and edit several cells simultaneously. This feature is one of our goals this year.

At present, GridView summaries values are read-only even in Batch Edit mode. They are not changed after an end-user changes grid values on the client until data is saved on the server side. 

We want to support automatically update summaries on the client side when the end-user edits cells.

Back to top 

Improve Adaptivity (v19.1 and v19.2)

This feature received 27% of the votes in our survey.
GridView collapses column cells to the adaptive data cell below a data row if the control is too narrow. We want to give you a capability to style the adaptive cell and implement templates for it.

The GridView pager in adaptive mode collapses all page number elements. We want to make the pager hide page elements one by one instead.

We plan to introduce new adaptive breakpoints to enhance layout customization for adaptive GridView.

We want to support format conditions in the adaptive cell.

Support row swipe to see additional actions like edit, insert, delete, etc., on mobile devices.

Back to top 

New client-side only operations (v19.1 and v19.2)

This feature received 26% of the votes in our survey.

Implement showing and hiding columns on the client-side (without using callbacks) and getting grid data.

Currently, you have to write custom code to transfer grid values on the client side using JSProperties if you wanted to get data without callbacks. We wish to implement a simple way to pass required column data to the client without additional coding.

Back to top 

Pivot Grid

Intermediate Level Aggregates and Window Calculations (v19.1 or v19.2)

This feature was planned for 2018, but we were unable to complete it in time last year.

The Pivot Grid’s new data processing engine will allow us to incorporate Intermediate Aggregates and Window Calculations out of the box. You will be able to configure both using a simple API and exploit the data processing engine’s built-in performance optimizations.

With Intermediate Aggregation, you will be able to use a new "Aggr" function. This function temporarily groups raw data by a set of dimensions and calculates a summary expression. This helps to answer questions such as: “What are the best and worst selling products in a given year?”, “How many days per month are profitable?”, etc.

Window Calculations allow you to display values calculated from existing data based on a defined rule. The following rules will be available by default: Percent of Total, Running Totals, Ranks, Moving Averages, Difference, Percentage Difference. As you might expect, you will be able to create custom rules with your own calculation logic as needed.

Back to top 

Scheduler

Performance enhancement (v19.1)

This feature received 33% of the votes in our survey.
We want to decrease page load time to load the Scheduler on a page faster.

Back to top 

RichEdit

Browser printing (v19.1)

Document comments (v19.2)

This feature received 20% of the votes in our survey.

Implement editable comments in a RichEdit document.

Back to top 

Spreadsheet

PivotTable row expand/collapse (v19.1)

This feature received 41% of the votes in our survey.

Implement data grouping and expand/collapse in Spreadsheet PivotTables rows.

Support multi-user collaboration. (v19.2)

Multi-user collaboration allows end-users to edit the same document simultaneously.

Back to top 

Charting

Histogram Series (v19.1)

This feature received 45% of the vote in our survey.

This Series view is useful when representing the distribution of numeric data via bars of equal width. Each bar displays the number of values that fall into consecutive, non-overlapping intervals of a variable.

Series Segment Colorizer (v19.1)

Waterfall Series (v19.2)

This feature received 45% of the vote in our survey.

Based on a start value, a Waterfall сhart displays the cumulative effect of sequentially added positive and negative values.

BoxPlot (v19.2)

Box plots are used to display the distribution of data through quartiles.

TimeSpan Axis Scale Type (v19.2)

The TimeSpan scale type will represent the values or arguments of series points as TimeSpan values on an axis.

Advanced Text Formatter for Crosshair Panel (v19.2)

Back to top 

Common Enhancements

Replace PNG to SVG icons in modern DevExpress ASP.NET themes (v19.1)

Back to top 

WebForms Bootstrap

New Controls

Floating Action Button (v19.1)

This feature received 23% of the votes in our survey.
A new control we shipped in our v18.2 release cycle for WebForms and MVC components. The Floating Action button encapsulates the most popular end-user actions (e.g., CRUD operations, data sorting, filtering, etc.). Buttons are based upon current context, the control is fully customizable and it supports custom actions.

FilterControl (v19.2)

Back to top 

GridView

Support Callbacks in GridView BatchEdit (v19.1)

Drop-down Editors Adaptivity (v19.1)

This feature received 34% of the votes in our survey.

When an end-user opens a drop-down window on a mobile phone, the drop-down window automatically becomes a modal; it is aligned by the screen size. If you are using data editors with drop-down windows (ComboBox, DateEdit, etc.) in your project, this feature will help to make your application mobile friendly.

Implement a GridView adaptive toolbar (v19.1)

This feature allows using the GridView on a mobile device when the toolbar is shown.

GridView client-side render (v19.2)

Back to top 

Miscellaneous enhancements

Responsive Project template (v19.1)

Bootstrap control performance enhancement (v19.2)

While Bootstrap controls become more and more powerful, we also want to make sure that they are still as fast as usual. Therefore, we focus a part of our efforts on control optimization to improve their performance

Back to top 

Reporting

New Web Report Designer Features (v19.1)

• Combine Multiple Reports into One
  We will give you the ability to combine multiple reports within the Report Designer, allow you to define print order and print all as a single document. This will address limitations associated with report merging (which is only available at runtime).
• Create Hierarchical Data Reports
  We will give you the ability to create hierarchical data reports (tree structures) and define the offset of a given band’s content based on nesting level.
• Create and Store Band Templates using the Report Gallery
  This will allow your customers to share gallery content and to generate reports with unified headers or footers.
• Bind a Report to JSON Data using the Data Source Wizard
  You’ll be able to use JsonDataSource and provide basic authentication settings, custom header values and custom query parameters.
• Create a Vertical Report using the Report Wizard
  We will add vertical reports to the Report Wizard.

XRPivotGrid: Advanced Cross-Tab Reports (v19.1)

JsonDataSource: Authentication Support (v19.1)

XRControl Enhancements (v19.1)

XRLabel: HTML-Inspired Text Formatting
We will allow you to format content in XRLabel using a subset of pseudo-HTML tags currently supported by our WinForms controls.

XRCheckBox: SVG Glyphs
We will allow you to change the default glyph associated with XRCheckBox using a pre-defined SVG glyph list.

New Web Report Designer Features (v19.1 and v19.2)

PDF Export: Visual Signatures (v19.2)

Printing Markdown Content (v19.2)

Rounded Corners (v19.2)

New Web Report Designer Features (v19.2)

• Re-order Detail Reports in Report Explorer
  This feature received 31% of the vote in our survey. 
  You’ll be able to move an entire detail report if it was created at the wrong report hierarchy level.
• Embed PDF Documents into a Report Document
  This feature received 44% of the vote in our survey. 
  You’ll be able to insert a PDF file into a report and define its content boundaries within a document.
• Move Bands to a "Background” Layer
  This feature received 31% of the vote in our survey. 
  You’ll be able to combine multiple bands so that content is rendered in a more compact manner.

• Display Empty Table Rows after Existing Data
  This feature received 21% of the vote in our survey. 
  You’ll be able to repeat empty rows until the bottom of the page is reached (to conform to a report’s structure).
• Edit XRRichText Content
  This feature received 50% of the votes in our survey.
  You’ll be able to use an in-place editor to edit RTF content.
  
  

Report Parameter Enhancements (v19.2)

• Date Range Parameter
  This feature received 26% of the vote in our survey. 
  You’ll be able to create a date range parameter and select its value at runtime using a single editor in the parameter panel.
• Date and Time Parameters
  This feature received 21% of the vote in our survey.
  You’ll be able to create a date or time parameter.
• Parameter Editor Grouping
  This feature received 20% of the vote in our survey.
  You’ll be able to logically group multiple report parameters in the parameter panel (display editors in a Group Box).
• Visibility of Parameter Editors
  This feature received 19% of the vote in our survey.
  You’ll be able to hide a parameter editor based on the value of a different parameter.

Back to top 

Office File API

Word Processing Document API

PDF Export (v19.1)

Embedded OpenType Font Support

Theme Fonts (v19.1)

For existing documents only. We expect to add theme font support to our Word Processing Document API.

Change Tracking (v19.2)

This feature received 21% of the votes in our survey.

Spreadsheet Document API (available in Universal subscription only)

PDF Export (v19.1)

Embedded OpenType Font Support

Optimized Printing and Layout Calculation Engine (v19.1)

This feature received 21% of the votes in our surveyand will help us improve printing and layout accuracy and increase rendering speed.

PDF Document API (available in Universal subscription only)

Non-Embedded CID fonts with Predefined Encoding (v19.1)

PDF documents containing non-embedded CID fonts with predefined encoding will be supported in our PDF document API

Multiple Signatures – PDF (v19.2)

We hope to introduce multiple signature support for PDF documents.

Back to top 

The information contained within this blog post details our current/projected development plans. Please note that this information is being shared for INFORMATIONAL PURPOSES ONLY and does not represent a binding commitment on the part of Developer Express Inc. This roadmap and the features/products listed within it are subject to change. You should not rely on or use this information to help make a purchase decision about Developer Express Inc products.

We wanted to thank everyone who voted in our 2019 Roadmap Survey. We value your feedback and thank you for sharing your thoughts with us. The following is a summary of our official 2019 roadmap.

Important Note: In nearly every instance, we selected features/products that received the highest vote count. In many instances, total votes for features that appear on this roadmap failed to break the 50% mark. This does not mean that the feature/product did not win the vote - it simply means that it received a plurality - not a majority.

Table of Contents

• DataGrid & TreeList
• Scheduler
• HTML/Markdown Editor
• Data Editors
• Data Form
• TreeView
• PivotGrid
• Data Visualization
• Data Export
• Data Layer
• Data Validation
• Performance Enhancements
• Themes
• Reporting
• Spreadsheet & Rich Text Editor
• New File Manager Control
• Office File API for .NET Core
• Visual Studio Tools
• ASP.NET Core 3 Support

DataGrid & TreeList

Record Reordering (v19.1)

This feature received 69% of the vote in our survey.

We’ll give you the ability to reorder DataGrid rows and change TreeList parent-child node relationships via drag-and-drop.

Excel-Like Editing Mode (v19.1)

We announced this feature in our 2018 Roadmap but it wasn’t ready to ship when v18.2 was released. We have received useful feedback on this feature and are going to ship it this year.

Cross-Component Drag-and-Drop (v19.1 or v19.2)

This feature received 69% of the vote in our survey.

Some business scenarios require that users move items from one collection to another or from one hierarchy to another. We hope to support cross-component item drag-and-drop operations.

Accessibility Enhancements (v19.1 or v19.2)

In v18.2, we improved the DataGrid’s keyboard navigation capabilities with our ‘focused row’ feature. We now want to address remaining accessibility gaps. We will make it possible to navigate to and work with any existing DataGrid and TreeList element (such as grouping, sorting, paging) via the keyboard.

TreeList

New Filtering Modes (v19.1)

This feature received 75% of the vote in our survey.

We’ll hope to extend the filtering capabilities of the TreeList with the following features:

• Enable search only through tree leaves
• Include filtered nodes children into filter results.

Remote Data Paging (v19.2)

This feature received 58% of the vote in our survey.

At present, if you expand a node, the TreeList loads all child nodes and then paginates them locally. We want to give you the option to load nodes individually. This feature will work with both the pager control and through virtual scrolling - Just like our DataGrid.

Scheduler

Adaptivity & UX Enhancements (v19.1)

This feature received 50% of the vote in our survey.

We want to enhance our Scheduler to look and behave better on small screens (mobile devices). You can find some examples of this adaptive behavior in its ASP.NET counterpart here. If you’ve encountered specific usability issues with Scheduler, please share them with us.

Standalone Recurrence Editor (v19.1)

We have a recurrence editor that is a part of the Scheduler appointment form and can’t be used separately. We expect to ship the Recurrence editor as a standalone control in 2019.

Performance - Virtual Scrolling (v19.2 or later)

This feature received 50% of the vote in our survey.

To help improve overall performance and usability, we hope to add a new virtual scrolling mode to our Scheduler control. When enabled, only visible appointments will be rendered.

HTML/Markdown Editor

Multiline Toolbar (v19.1)

At present, Toolbar items are hidden within a dropdown menu on small screens. If the number of items is large (as it is in the HtmlEditor) the menu gets too long and becomes difficult to use. We’ll introduce one more adaptive mode that will create a second horizontal line of toolbar items instead of creating a dropdown menu.

Mentions Support: via @ (v19.1)

‘Mentions’ allow you select users or user groups by typing @ when composing rich text content. It’s widely used in team collaboration tools and project management applications.

Resize of Media Blocks (v19.1)

We’ll give you the ability to resize images and video blocks via the mouse.

Upload Images via Drag-and-Drop & Copy/Paste (v19.1 or v19.2)

You will be able to embed images as base64-formatted content or upload it to a web server via drag-and-drop or copy-paste actions and reference it as a URL.

Tables Support (v19.2)

We’ll give you the ability to insert and edit data tables.

Inline Formatting Toolbar (v19.2 or later)

You’ll be able to reveal an inline formatting toolbar when selecting content that requires formatting.

Data Editors

Additional Action Buttons (v19.1)

This feature received 83% of the vote in our survey.

Extend built-in editor action buttons with custom actions. You can find some examples of this feature here.

Data Form

Dynamic Updates without a Full Re-render (v19.1)

This feature received 82% of the vote in our survey.

We recently added partial update support to several controls. This update can also be applied to the Form control (for those who dynamically update forms and do not want to initiate a full form re-render).

TreeView

Node Reordering (v19.2)

This feature received 69% of the vote in our survey.

Change parent-child relationships of TreeView nodes via drag-and-drop.

Cross-Component Nodes Drag-and-Drop (v19.2)

This feature received 69% of the vote in our survey.

Move a node from one hierarchy to another using drag-and-drop.

New Dropdown Button Control (v19.1)

A button with a built-in dropdown menu. You can find this kind of control in many modern web applications. Please, refer to the Bootstrap implementation for an example.

New Floating Button Control (v19.1)

The concept of a Floating Button began with Material Design guidelines. We’ll support a simple Floating Button and a Floating Button with a pop-up menu.

New Drag-and-Drop Utilities (v19.1 or v19.2)

This feature received 78% of the vote in our survey.

We want to create a drag-and-drop utilities library so you can construct custom drag-and-drop functionality outside of our UI controls. One such usage scenario involves list sorting. We’ll make it extremely easy to implement such functionality.

New Kanban Board Control (v19.2)

This feature received 67% of the vote in our survey.

Kanban Board has become an essential control for task and project management in modern business web applications.

PivotGrid

Remote Data Paging (v19.1 or v19.2)

This feature received 63% of the vote in our survey.

In 2019, we will give you the option to use partial aggregated data loading from a remote server. This new feature will work with both the Pivot Grid’s pager control (horizontal and vertical) and via virtual scrolling.

Data Visualization

Chart Annotations (v19.1)

This feature received 77% of the vote in our survey.

Annotate your charts with custom labels.

Scrollbar as RangeSelector in Charts (v19.2)

This feature received 65% of the vote in our survey.

Enhance a chart scrollbar to show the chart preview with range selection capability. This feature can help visualize long time-based series with zooming/scrolling enabled.

Zooming in Polar Chart (v19.2)

This feature received 31% of the vote in our survey.

Enable zoom for the Polar Chart.

Based on feedback we’ve received to date, customization is crucial to many of you. We are going to dedicate significant resources to address limitations in this regard.

Legend Enhancements (v19.2 and v19.2)

This feature received 27% of the vote in our survey.

We are considering the following legend features:

Expected in v19.1:

• Add legend title
• Custom item order
• Item grouping

Expected in v19.1 or v19.2:

• Add a legend to the Bar Gauge

Expected in v19.2 or later:

• Custom item bullets
• Hide legend items for empty series
• Extract the legend as a standalone control
• Display a legend inside a Pie or Donut

Resolve Label Overlaps (v19.1 and v19.2)

This feature received 26% of the vote in our survey.

In certain usage scenarios, our JavaScript Charting library can properly resolve label overlaps. We want to improve our product so that it can address the following use-cases:

Expected in v19.1:

• Resolve labels overlaps in Funnel Chart.
• Resolve label overlaps in Bar Gauge.

Expected in v19.2 or later:

• Resolve cross-series label overlaps.
• Resolve labels overlaps for constant lines and strips.

Other Chart/Gauge Enhancements (v19.2 and v19.2)

Expected in v19.1:

• Word-wrap within legend items, labels and titles
• Extend available Chart/Gauge events (context menu event, element click or double click)
• Set the custom position of axis (enable quadrants)
• Manage exported chart layout (layout by columns, etc.)

Expected in v19.1 or v19.2:

• Display a tooltip only on point/series hover
• Support custom points, labels, tooltip rendering using templates
• Display custom text inside a Pie or Donut
• Enable z-index for constant lines (to bring them behind or in front of other series)
• Specify the size of a chart pane (for multi-pane charts).

Expected in v19.2 or later:

• Support custom styles of Chart/Gauge elements (gradients, patterns, background images, etc.)
• Display negative values for logarithmic scales
• Use multiple colors for a single series (based on value/argument)
• Display total value labels for stacked series
• Animate zoom-in and zoom-out transition.

Data Export

Export to Excel Customization Enhancements (v19.2 and v19.2)

Expected in v19.1:

• Custom headers/footers

Expected in v19.2:

• Multi-sheet export
• Export summaries as functions

Expected in v19.2 or later:

• Images export

Export to PDF (v19.2 or later)

This feature received 48% of the vote in our survey.

We plan to offer a PDF export option in our DataGrid and Pivot Grid.

Data Layer

OData v4 Support (v19.1)

This feature received 58% of the vote in our survey.

OData v4 support enables remote grouping and summary operations within DevExpress ASP.NET Core - improving performance when using large datasets.

Data Validation (v19.2)

Asynchronous Validation

When a user submits a data form, you may need to execute asynchronous remote validation. For instance, you may want to check whether a user already exists in the database during registration. We’ll provide a straight-forward API for such usage scenarios.

Performance Enhancements

Virtual Scrolling and Lazy Loading Everywhere (v19.2)

This feature received 70% of the vote in our survey.

The vast majority of DevExpress users work with large datasets (from thousands to millions of records). These datasets are rendered as lists within our controls. Our DataGrid supports virtual scrolling with lazy data loading. We’d like to make this feature available everywhere. This feature can be applied to the following list of controls:

• TreeView
• Scheduler
• Lists
• DropDowns & Lookups
• Header filters in DataGrid, TreeList, PivotGrid
• Column choosers in DataGrid, TreeList, PivotGrid

Themes

Element and Font Size Customization (v19.1)

This feature received 78% of the vote in our survey.

Our users find the ‘compact’ themes very useful when generating a highly dense, data-intensive UI. We will introduce a compact Material UI theme and give you the ability to customize theme element and font size.

Chart Themes (v19.2)

This feature received 70% of the vote in our survey.

We will update our Charting library so you can customize its appearance via the Theme Builder.

Reporting

New Web Report Designer Features (v19.1)

• Combine Multiple Reports into One
  We will give you the ability to combine multiple reports within the Report Designer, allow you to define print order and print all as a single document. This will address limitations associated with report merging (which is only available at runtime).
• Create Hierarchical Data Reports
  We will give you the ability to create hierarchical data reports (tree structures) and define the offset of a given band’s content based on nesting level.
• Create and Store Band Templates using the Report Gallery
  This will allow your customers to share gallery content and to generate reports with unified headers or footers.
• Bind a Report to JSON Data using the Data Source Wizard
  You’ll be able to use JsonDataSource and provide basic authentication settings, custom header values and custom query parameters.
• Create a Vertical Report using the Report Wizard
  We will add vertical reports to the Report Wizard.
• Customize the Report and Data Source Wizard
  We will provide the ability to customize the Report and Data Source Wizard (insert new pages and customize the appearance of existing reports).
• Bind a Report to ObjectDataSource Using the Data Source Wizard
  This feature received 28% of the vote in our survey.
  You’ll be able to use this data source type in the Data Source Wizard to bind a report to a collection of business objects.

New Web Report Designer Features (v19.2)

• Re-order Detail Reports in Report Explorer
  This feature received 31% of the vote in our survey.
  You’ll be able to move an entire detail report if it was created at the wrong report hierarchy level.
• Embed PDF Documents into a Report Document
  This feature received 44% of the vote in our survey.
  You’ll be able to insert a PDF file into a report and define its content boundaries within a document.
• Move Bands to a ‘Background’ Layer
  This feature received 31% of the vote in our survey.
  You’ll be able to combine multiple bands so that content is rendered in a more compact manner. See example here.
• Display Empty Table Rows after Existing Data
  This feature received 21% of the vote in our survey.
  You’ll be able to repeat empty rows until the bottom of the page is reached (to conform to a report’s structure). For more information on this feature, please refer to the following support tickets: T602604, T666620.
• Edit XRRichText Content
  This feature received 50% of the vote in our survey.
  You’ll be able to use an in-place editor to edit RTF content.

Report Designer: Data Federation (v19.1 and v19.2)

This feature received 55% of the vote in our survey.

You’ll be able to define the relationship between different data source tables, queries, sheets and object lists.

Web Document Viewer and Web Report Designer: Localization (v19.1)

This feature received 50% of the vote in our survey.

You’ll be able to translate Web Document Viewer and Web Report Designer user interface elements using the DevExpress Localization Service and download a JSON file with translations for your web page.

XRPivotGrid: Advanced Cross-Tab Reports (v19.1)

We will provide a new way to create cross-tab reports using an enhanced version of XRPivotGrid report control. This will allow you to use expression bindings to calculate data and define the appearance of each visual element within a cross-tab report without writing code.

XRRichText Control Support (v19.1)

We will port our XRRichText report control to .NET Core platform so you can display RTF / HTML content within a report.

JsonDataSource: Authentication support (v19.1)

You’ll be able to provide basic authentication settings, custom header values and custom query parameters.

XRControl Enhancements (v19.1)

• XRLabel: HTML-Inspired Text Formatting
  We will allow you to display HTML content in XRLabel. We expect to provide support for the subset of pseudo-HTML tags currently supported by our WinForms controls.
• XRCheckBox: SVG Glyphs
  We will allow you to change the default glyph associated with XRCheckBox using a pre-defined SVG glyph list.

TypeScript Definitions (v19.1)

We will provide *.d.ts files required for TypeScript, so you can benefit from code completion in your development environment as a result.

PDF Export: Visual Signatures (v19.2)

You’ll be able to define visual signatures displayed in an exported PDF file using a new report control.

Printing Markdown Content (v19.2)

This feature received 57% of the vote in our survey.

You’ll be able to pass Markdown markup to a special report control. This control will use the HTML conversion to display Markdown content in a printed or exported document.

Rounded Corners (v19.2)

This feature received 32% of the vote in our survey.

You’ll be able to define corner radius for the borders of the XRLabel, XRPanel, and XRTable controls.

Report Parameter Enhancements (v19.2)

• Date Range Parameter
  This feature received 26% of the vote in our survey.
  You’ll be able to create a date range parameter and select its value at runtime using a single editor in the parameter panel.
• Date and Time Parameters
  This feature received 21% of the vote in our survey.
  You’ll be able to create a date or time parameter.
• Parameter Editor Grouping
  This feature received 20% of the vote in our survey.
  You’ll be able to logically group multiple report parameters in the parameter panel (display editors in a Group Box).
• Visibility of Parameter Editors
  This feature received 19% of the vote in our survey.
  You’ll be able to hide a parameter editor based on the value of a different parameter.

Translate Report Documents to Different Languages (v19.2)

This feature received 45% of the vote in our survey.

You’ll be able to provide different translations for report controls.

Spreadsheet & Rich Text Editor

In v18.2, we announced CTPs of both our Spreadsheet and Rich Text Editor controls for ASP.NET Core. We will officially release these products in 2019 with the following new features:

Rich Text Editor (v19.1 and v19.2)

• Mail merge
• Spell checker
• Document protection
• RTF format support
• Printing
• Export to PDF

Spreadsheet (v19.1 and v19.2)

• Dialogs
• Formula bar
• Context menus
• Formula auto-complete
• Read/View modes
• Worksheet protection API
• Global custom functions
• Custom in-place editor API
• Printing
• Export to PDF

New File Manager Control (v19.2)

We plan to add a new Explorer-like component to manage files and folders. These will ship with a client-side responsive UI and REST API for file operations. We will include a set of helpers to connect to server files system and cloud services (Azure, Amazon, Google Drive, etc).

Office File API for .NET Core (v19.1 and v19.2)

This feature received 45% of the vote in our survey.

.NET Core Support will be offered for our Word Processing, Spreadsheet and PDF Document API.

The v19.1 release will include the following restrictions: export to PDF will be partially supported and image generation of PDF documents will not be implemented for Linux.

In v19.2, we will add embedded font support for PDF documents and RTL support for our Word Processing Document API on Linux.

Visual Studio Tools

Visual Studio Project Templates with Responsive App Layouts (v19.1)

This feature received 70% of the vote in our survey.

In our v18.2 release cycle, we introduced a Drawer component and a set of responsive application layouts for Angular. We are going to replicate these layouts for ASP.NET Core and integrate them into new Visual Studio project templates.

CRUD Forms Generation in Visual Studio Scaffolder (v19.2)

This feature received 65% of the vote in our survey.

We recently introduced the scaffolding necessary to enable editing for CRUD list views (based on our DataGrid and TreeList controls). If you need to edit data objects with numerous properties, you may want to use a separate data Form instead of inline editing within the list view. We will extend the capabilities of our design time tools with a new Data Form Scaffolder.

XPO support in CRUD Web API Scaffolder in Visual Studio (v19.2)

This feature received 57% of the vote in our survey.

Our existing CRUD API scaffolder uses Entity Framework data models to generate API controllers. We hope to support XPO (eXpress Persistent Objects) as an ORM data model source in 2019.

ASP.NET Core 3 Support (v19.2)

A new major version of ASP.NET Core will be released in 2019. We will make certain that all our components, APIs, and Visual Studio tools are compatible with the updated framework and SDK.

As always, we welcome your feedback. Feel free to leave a comment and let us know what you think of our 2019 ASP.NET Core Roadmap.

The information contained within this blog post details our current/projected development plans. Please note that this information is being shared for INFORMATIONAL PURPOSES ONLY and does not represent a binding commitment on the part of Developer Express Inc. This roadmap and the features/products listed within it are subject to change. You should not rely on or use this information to help make a purchase decision about Developer Express Inc products.

We are just two months away from our next major update, v19.1. As with all the other teams, we, the ASP.NET Team, will be posting about the new features that are coming up, sharing our progress, and letting you test major new functionality before we wrap up another development cycle. Although I'll soon be posting about the new features in our existing ASP.NET toolset, in this particular post I thought I'd start with a brand new control, the DevExpress Web Diagram control.

Since it's a new one, and we're exploring what we can profitably include as functionality in its first iteration, I thought I'd introduce it, talk about its features, and point out the current limitations. That will help you to play around with it, and test the new functionality before we release the first version.

New Web Diagram Control

I'm sure you know what a Diagram Control is, and indeed know what you'd like from it (and we'll be asking you for input!), but let's start with a screenshot of the new Web Diagram Control in action:

Demo

We've published an online demo of the control so you can test it: DevExpress Web Diagram Control. The demo even gives you the opportunity to load your own data by clicking Import Data, although be warned there are currently some limitations to that feature.

Features

The diagram control is an advanced tool which is designed to satisfy different requirements:

1. It's a client-side control

The core part of the DevExpress Web Diagram control is implemented in TypeScript. Consequently all of the user experience and interactions run completely in the browser, the back-and-forth with the server is minimized. Apart from efficiency, this also give us the benefit that we can immediately introduce the control for all DevExpress web platforms: ASP.NET WebForms, ASP.NET Core, ASP.NET MVC, and DevExtreme.

2. Process and Flow diagrams

The new control provides for the modeling, editing, and displaying of diagram processes and flows.

We've added the capability to bind the control to your process model, and generate and auto-layout diagram items for each element of your model. An added benefit is that the control supports importing from Business Process Model Notation xml files.

3. Structures

The Web Diagram control's designer gives you the opportunity to display and edit structures, be they org charts, or representations of some kind of structured data. We plan to support two-way binding from your model to a diagram in the future.

4. Drawing and Prototyping

The designer includes a number of built-in shapes and will support importing of custom shapes in the final release. So you can use the Web Diagram Control to create, show, and edit your diagram documents with ease.

Current Limitations

Although I have -- dare I say it -- diagrammed what the control will have in its first release, this preview version has some limitations.

1. It is not within the current CTP release of our ASP.NET toolset. We plan on releasing a CTP of the control in a later beta, but for now, please try out the demo to see and understand its capabilities.
2. In the preview version, you can import data from external sources using an URL. Unfortunately, two-way binding is not yet supported.
3. The library of built-in shapes currently only includes these categories: standard and flow shapes. Custom shapes are not yet supported. The shape library will be expanded in future releases. Please let us know, using the survey below, which built-in shapes are important for your projects, it will help us to prioritize our TODO list.
4. The control supports diagram import/export using its own proprietary JSON format. Other formats (including XtraDiagram and Diagram for WPF xml files) are not yet supported.
5. At the time of writing, it only supports one auto-layout algorithm: tree view. We will be adding more auto-layout algorithms in future versions.

Feedback

Please take a moment to answer the questions in this short survey:

Download Preview Release

While this preview release does not contain the new web diagram control, you can still download the preview release and test the other v19.1 features. For our Web Diagram control, please test it using the online demo.

If you own an active Universal or DXperience subscription, you can download the CTP build from the DevExpress Download Manager and test the v19.1 features announced so far. Once you do, take a moment to let us know how well the new features address your requirements. This will help us fine-tune our code before the launch.

If you are using a trial version and want access to the new features today, purchase a Universal subscription license and you will automatically gain access to the CTP version. If you are ready to upgrade to Universal from another subscription level, email us at clientservices@devexpress.com for preferential upgrade pricing.

Thank you.

Good news, the powerful DevExpress Office controls are now officially available for the DevExpress ASP.NET Bootstrap WebForms line of controls.

When we initially released v18.2, these controls were not completely ready and therefore, we provided them as a 'preview'. During this 'preview', we gathered feedback, fixed bugs, and finalized the bits for these controls.

Now they're officially out of 'preview' mode and ready to be used in your production environments!

New Spreadsheet

Our new ASP.NET Bootstrap Spreadsheet control allows you to deliver Excel inspired functionality with minimal effort. Its features include:

• Worksheet protection
• Printing
• Sorting & Filtering data
• Graphical data presentation via charts
• Specifying formulas
• Inserting images

Demo: https://demos.devexpress.com/Bootstrap/Spreadsheet/Default.aspx

Documentation: https://documentation.devexpress.com/AspNetBootstrap/120666/Spreadsheet

New Rich Text Editor

Our new ASP.NET Bootstrap Rich Text Editor allows you to integrate advanced text editing functionality into your next web application. It ships with comprehensive text formatting options and a rich collection of end-user options so you can deliver Microsoft Word-inspired functionality with ease.

Features include:

• Text formating
• Spell checking
• Mail merge
• Save & Export to various formats
• Insertion of tables, lists, images, hyperlinks, and etc.
• Document management

Demo: https://demos.devexpress.com/Bootstrap/RichEdit/Default.aspx

Documentation: https://documentation.devexpress.com/AspNetBootstrap/120667/Rich-Text-Editor

New Ribbon

A Ribbon control provides your ASP.NET Bootstrap web applications with ribbon functionality, i.e., a set of toolbars placed on several tabs:

Features:

• Data Binding
• Keyboard Support
• Quick Access Toolbar
• Adaptivity
• Templates
• Client-Side Events
• Client-Side Functionality

Demo: https://demos.devexpress.com/Bootstrap/Navigation/Ribbon.aspx

Documentation: https://documentation.devexpress.com/AspNetBootstrap/120668/Site-Navigation/Ribbon

Take a look at this classic post to see some benefits of a Ribbon control.

Feedback

Please take a moment to answer the questions in this short survey:

The DevExpress ASP.NET Bootstrap WebForms controls provide great UI and functionality for your Bootstrap enabled websites. In the latest release, we introduced the powerful DevExpress ASP.NET File Manager control to this line up.

It looks stunning too, check out this screenshot:

Features

Supports Bootstrap

The DevExpress Bootstrap controls were designed from the ground-up to work seamlessly in the Bootstrap framework. The new File Manager control will integrate into your existing Bootstrap-based website with ease.

Cloud, FileSystem, & More

Our new Bootstrap FileManager control supports many of the same great features which are also available in the classic DevExpress ASP.NET FileManager:

• Physical FileSystem Provider
• Data Binding
• Cloud Support (Azure, Amazon, Dropbox, etc.)
• Thumbnails and Detail views
• Role and Access permissions

Several other helpful features are built-in: uploading, downloading, filtering, and more.

It's Adaptive!

The new control also provides adaptive and responsive features which help when you're designing for different size screens like mobile and desktop.

Adaptive Demo

Demo

Test the Bootstrap FileManager demo here: Bootstrap FileManager demos.

Better yet, download the latest release and test the new File Manager in your local development environment. Then be sure to leave your feedback by dropping me a comment below, thanks.

The DevExpress ASP.NET Rich Text Edit control for WebForms and MVC provides your end-users with powerful Word-Like UI and functionality. In the latest release, we introduced a new view mode for this control, let's take a look.

Simple View Mode

You can now view documents in a new mode called 'Simple View'. As the name implies, this mode provides a simple layout where the document is not split across multiple pages, nor does it have margins, headers, or footers. In essence, it's similar to a simple web layout.

Advantages

The 'Simple View' mode provides advantages for both mobile and desktop browsers:

Mobile-Friendly

Without the extra items like margins, headers, and footers, the document's content will become responsive and therefore adjust the width to the viewing area. This is especially handy for mobile devices:

Adaptive Memo-Style

You can also convert the powerful control into a simple memo-style control. This means while the UI is simple, you still have the rich formatting capabilities of the Rich Text Edit control.

To enable memo-style, set the Rich Text Edit control's RibbonMode="None" and ShowStatusBar="false":

Switch Layouts

Easily switch between two available view modes (Simple View ↔ Print Layout) by using the corresponding ribbon commands.

You can also set the initial mode when the control is loaded using the ViewType property.

Demo

Test drive the Rich Text Edit control's Simple View demo here: Demo.

Better yet, download the latest release and test the new File Manager in your local development environment. Then be sure to leave your feedback by dropping me a comment below, thanks.

I'm sure you are aware of Microsoft's recent advances for Visual Studio, .NET Core, and their new efforts in creating/deploying/using web applications. Along with these accomplishments -- and also to give our ASP.NET team something else to do! -- we are releasing a set of seven native components to help you build rich browser-based UI using Razor Components and Blazor.

Blazor? Razor Components?

Let's take a quick detour to understand what these technologies are, and how they could help you, and why we decided to create this new suite.

Firstly, though, let's quickly talk about developing client-side web apps. Traditionally, this meant you could only use JavaScript. In fact, you needed JavaScript to do anything on the client-side.

With Blazor / Razor Components you can now write rich interactive client-side web UI using .NET! This means you can write client-side web apps using C# and Razor syntax with .NET assemblies. In fact, the name comes from combining Browser + Razor = Blazor.

Let's take a look at how Blazor works.

Blazor - a client-side framework

This is a fairly new framework that Microsoft created with an open-source product called WebAssembly. WebAssembly? To quote Mozilla, WebAssembly...

...is a low-level assembly-like language with a compact binary format (Wasm) that runs with near-native performance and provides languages such as C/C++ and Rust with a compilation target so that they can run on the web. It is also designed to run alongside JavaScript, allowing both to work together.

What Microsoft did with Blazor is to run .NET code, using Mono compiled under WebAssembly, into Wasm code that could execute in the browser.

Microsoft's Blazor documentation has a good breakdown of what occurs when a Blazor app is built and run in a browser:

• C# code files and Razor files are compiled into .NET assemblies.
• The assemblies and the .NET runtime are downloaded to the browser.
• Blazor bootstraps the .NET runtime and configures the runtime to load the assemblies for the app. Document Object Model (DOM) manipulation and browser API calls are handled by the Blazor runtime via JavaScript interop.

Image by Daniel Roth, Microsoft Docs

Now you know how Blazor works in the browser, let's take a look at what Blazor is...

Blazor is a single-page app framework for building interactive client-side Web apps with .NET. Blazor uses open web standards without plugins or code transpilation. Blazor works in all modern web browsers, including mobile browsers. -Microsoft Docs

What benefits does this give you?

• You don't need to use JavaScript to create the UI for your single-page application (SPA). You can write everything in C# or VB.
• Blazor apps running on WebAssembly render client-side and you also have access to the .NET ecosystem.
• You can share the server-side and client-side logic. Full-stack development, in other words.
• Since it's all .NET, all the time, you can rely on its performance, reliability, and security.
• You're using Visual Studio 2019 for development.

It does have some downsides, though:

• Debugging is a pain. Remember: what's executing in the browser is Wasm code, not C#, not JavaScript.
• Download times: you get the runtime as WASM, but most of your app is downloaded as normal .NET assemblies
• Currently, Microsoft describe it as "experimental".

While Blazor on the client-side is still an experimental project, Microsoft has been shipping a steady stream of updates, so hopefully the experimental label will be gone soon. They're actively working to improve the downsides too and we look forward these updates.

Razor Components

Now a quick word about Razor Components:

A Razor Component is a piece of UI, such as a page, dialog, or data entry form. Components handle user events and define flexible UI rendering logic. Components can be nested and reused. Components are .NET classes built into .NET assemblies that can be shared and distributed as NuGet packages. The class can either be written in the form of a Razor markup page (.cshtml) or as a C# class (.cs). -Microsoft Docs

If you've used Angular or React, then you're familiar with the concept of everything in the UI being a component. Razor Components behave the same way. This component model gives you more control over how you build and control your UI.

Razor Components are what you use to create Blazor apps. One key advantage of Razor Components is they can be used either on the client-side or server-side!

Server-side Blazor

The benefits of Blazor in the browser are significant, but problematic. So, to address the problems, Microsoft introduced what might be called "server-side Blazor". In short, the UI is hosted and rendered on the server and then sent to the client (and updated) via SignalR over a real-time connection, a web socket. In other words, all of the benefits I just mentioned, with none of the issues. All C# and Razor syntax, and no need for JavaScript.

Image by Daniel Roth, Microsoft Docs

What benefits does this give you?

• Faster app startup
• Runs on .NET Core (fast, not limited by WebAssembly or browser sandbox)
• Simpler for some scenarios

It does have some downsides, though:

• Requires a connection (no offline)
• Latency
• Requires more server resources

However, Microsoft is actively updating Blazor on their GitHub repo and we look forward to see this new technology develops in the coming months.

DevExpress UI for Blazor / Razor Components

To celebrate this new technology, we have designed and created a new suite of Razor Components for Blazor. Best of all, these new components will work for both client and server side Blazor!

The controls are native for Blazor and newly created by our ASP.NET developers. The same devs who have built our excellent ASP.NET controls.

We are releasing them as a free "early access" preview through Nuget. There are seven components so far: a Grid (of course!), a Pivot Grid, and various editors (a Combo Box, a Spin Edit, a Date Edit, Text Box, and Pager) that can be used within the grid.

The grid is the most complete: it provides data binding, editing, paging, filtering, row selection, some pre-defined column types, and the use of templates.

In fact, the data binding supports component parameters, which bind a property values across components.

There are a couple of events for editing too:

namespace DevExpress.Blazor {
    public class DxDataGrid {
        [Parameter] internal RenderFragment ChildContent { get; set; }
        [Parameter] IEnumerable<T> Data { get; set; }
        [Parameter] protected bool ShowColumnHeaders { get; set; } = true;
        [Parameter] protected bool ShowFilterRow { get; set; } = true;
        [Parameter] protected bool ShowPager { get; set; } = true;
        [Parameter] protected bool AllowRowSelection { get; set; } = true;
        [Parameter] protected int PageSize { get; set; }
        [Parameter] Action<T> SelectedItemChanged { get; set; }
        [Parameter] T SelectedDataItem { get; set; }
        [Parameter] Action<T> RowRemoving { get; set; }
        [Parameter] Action<T, Dictionary<string, object>> RowUpdating { get; set; }
        [Parameter] Action<Dictionary<string, object>> RowInserting { get; set; }
    }
...

Obviously we have plans for more components and more functionality, and I'll talk about this in a moment.

Download the preview from NuGet

If you wish to test the DevExpress UI for Blazor / Razor Components, download the DevExpress.RazorComponents.nupkg from the DevExpress NuGet Early Access feed. Once you've added this feed to Visual Studio 2019, you'll see the DevExpress.RazorComponents package:

This preview is made available under the DevExpress Preview end-user license. To gain access to the build free of charge, you will need a DevExpress.com account. You can either create a free account to test our NuGet package or you can get a free 30-day trial of all our controls.

Demo

Experience the DevExpress Razor Components online here:

https://demos.devexpress.com/razor-components/

Get Started

We've created a guide to help you learn how to create a new project and use DevExpress UI for Blazor / Razor Components:

https://github.com/DevExpress/RazorComponents/

Watch Training Videos

We've prepared four excellent getting-started videos to help you learn Blazor:

1. Getting Started
2. Component Structure
3. Dependency Injection & Data Access
4. JavaScript Interop

Plans

First, these preview components will be further developed with new features and functionality. Obviously, as Microsoft releases updates to .NET Core, so shall we.

Second, although we have many plans for more components within this new ecosystem, as with all of our future projects we rely on feedback from you, our customers, on what we should be looking at and considering. Send us emails, open up support tickets, let us know.

Along those lines, please take a moment to complete this short survey:

Thanks!

A project template is great because it creates the core pieces for a full working web application. This allows you to get up and running in minutes.

Last year, we created a responsive project template for our classic ASP.NET web controls. We learned from your excellent feedback that you want more responsive templates for our other web controls too.

Good news, a new responsive project template is now available for our DevExtreme-based ASP.NET Core controls!

The new template is part of the upcoming v19.1 release and you can skip to the end if you're ready to download it. But first, take a look at the template's powerful features.

Responsive & Adaptive

The template makes use of several DevExtreme ASP.NET Core Controls including the DataGrid, Drawer, and ToolBar.

We used our existing DevExtreme Angular Template as a foundation because it provides great responsive features.

The navigation layout uses our Drawer component and supports multiple responsive breakpoints. Thus, your apps will look great on any screen:

Best Practices

We built this project template with the latest technologies and best practices. That's why our new project template is:

• Built on top of the mainstream ASP.NET Core 2.1 with support for Razor Pages.
• Built using our excellent DevExtreme ASP.NET Core Controls.
• Pre-configured with a bundleconfig.json file so the scripts and styles are automatically bundled and minified.
• Fully compatible with our helpful design-time Web API and Razor scaffolding wizards.
• Styled with a custom dual-color Material UI theme, thanks to the new DevExtreme Color Swatches feature:

Rest assured, when Microsoft releases an ASP.NET Core update then we'll keep pace and update our project template as well.

Visual Studio

This new project template is only for Visual Studio users. You'll find it in the Visual Studio "File → New" dialog. If you're using the new Visual Studio 2019 wizard then you can search for our new template. Type 'DevExtreme' rather than "ASP.NET Core" to narrow down to our specific new template:

Test It Now (and provide feedback)

Test-drive the project template on your local machine. If you're a current DXperience customer then download the v19.1 release from the Client Center.

Then let us know your experience with the new project template.

Join the Webinar

Sign up for the upcoming "What's New in v19.1 - ASP.NET, MVC, and ASP.NET Core Controls" webinar where:

• you'll see all the new features/tools/components in v19.1 and
• you can ask questions and interact with our devs

Register today: https://register.gotowebinar.com/register/3160148549159921421

Today, we're happy to introduce a new Gantt control, as a CTP, for our ASP.NET WebForms and MVC set of controls. With our new control, you can add Gantt scheduling to your ASP.NET websites:

The new ASP.NET Gantt control displays 'tasks' as horizontal bars along timescales, shows the current schedule status, and displays the hierarchy and dependency relationships between the tasks.

This new control is great for creating time and resource based schedules for projects like tasks, activities, jobs, orders, and more.

Built With

As you know, we love to reuse code whenever possible. So we've built this new Gantt control by using our current ASP.NET TreeList control as a base! By reusing a solid and proven control, we can provide you a new control with:

• familiar UI elements
• powerful built-in features

And it helps us save time too. We use this time to focus on more features and controls for you. So, it's a win-win.

Now let's take a look at the design. The new ASP.NET Gantt control has two main UI areas:

TreeList Area

On the left side of the control is the tree layout. This 'TreeList area' displays the task hierarchy and columns. This functionality is provided courtesy of our TreeList control.

Gantt Area

On the right side is the new 'Gantt area'. This side displays tasks, resources, task dependencies, and a timescale.

Features

While it is a CTP version, our new ASP.NET Gantt control provides some great features out-of-the-box:

• Data binding
• Multiple views
• Built-in scrolling
• Display task progress
• Use different time scales (hours to months)
• Ability to specify resources for tasks
• TreeList and Gantt regions hierarchically display tasks, milestones, dependencies, and resources
• API to configure custom work time, weekends, and special dates

Let's take a deeper look at some these features.

Getting Started - Data Binding

The Gantt control works by binding to a data source. You can data bind the control to a variety of data sources too because it supports the standard data source types (SqlDataSource, ObjectDataSource, AccessDataSource, etc.).

After data binding, you'll want to map the fields between your data source and our Gantt control. To see how easy it is, take a look at the 'Mappings' section in this markup:

And you're done, now you can use the Gantt control to display the tasks and their resources and dependencies.

View Types

We've added the scales property which allows you to control how much detail you want to display in the timescale:

Hours

If the Day and Hour scales are enabled, then this allows you to see the granular details of each task:

Days

With the Week and Day scales enabled, we see less detail but get more context in relation to other tasks:

Weeks

When the Month and Week scales are enabled, we get a nice mid-level view:

Months

Finally, enabling the Year and Month scales allows us to see the 'big picture' or top-level view:

Client-Side API

Our new control also provides a client-side API which can:

• show or hide the resources
• control the tasks’ subject location

In case you're curious, the subject field is simply the name of the task.

Here's a short overview of the relationship between task and resource:

With the client-side API, you control how the resources and task subjects are displayed. For example...

When the "Subject Location" is set to "Inside" and the "Show Resources" option is enabled, you'll get this layout:

Or you can set the "Subject Location" to "Outside" and disable the "Show Resources" option for this layout:

Custom Work Time

Our new ASP.NET Gantt control allows you to specify custom work days, work hours, and holidays for the timescale.

Use these four work time rules for timescale customization:

• Daily Rule
• Weekly Rule
• Monthly Rule
• Yearly Rule

With these rules, you can configure both the work time ranges and recurrence settings.

Let's take a look at some examples:

If you need to setup custom work hours, use the Daily Rule:

<dx:DailyRule><WorkTimeRanges><dx:WorkTimeRange Start="08:00" End="11:55" /><dx:WorkTimeRange Start="13:00" End="17:00" /></WorkTimeRanges></dx:DailyRule>

Use the Weekly Rule to set non-working days:

<dx:WeeklyRule IsWorkDay="false"><Recurrence DayOfWeek="Sunday" /></dx:WeeklyRule><dx:WeeklyRule IsWorkDay="false"><Recurrence DayOfWeek="Monday" /></dx:WeeklyRule>

Or use the Yearly Rule and setup custom holidays:

<dx:YearlyRule IsWorkDay="false"><Recurrence Day="14" Month="February" /></dx:YearlyRule><dx:YearlyRule IsWorkDay="false"><Recurrence Day="8" Month="March" /></dx:YearlyRule>

CTP

This new Gantt control is available as a CTP (community technology preview) in the v19.1 release. We're not quite finished with all the features yet but rest assured, we're working on it.

One of the limitations of this CTP is the Gantt MVC extension is not available for testing yet. Therefore, it's not included in the v19.1 beta I mention below. However, it will be available once we release the final version in a future release.

Test it today

Test-drive the new ASP.NET Gantt WebForms control on your local machine. If you're a current DXperience or Universal customer then download the v19.1 release from the Client Center.

Your Feedback Counts

We’d like to hear from you about your development plans and needs. Feel free to leave comments below or open Support Center tickets for detailed discussions.

For some quick feedback, please submit your responses to this short survey:

Join the Webinar

Sign up for the upcoming "What's New in v19.1 - ASP.NET, MVC, and ASP.NET Core Controls" webinar where:

• you'll see all the new features/tools/components in v19.1 and
• you can ask questions and interact with our devs

Register today

Preview 5 of the DevExpress UI for Blazor is now available. It includes support for ASP.NET Core 3 Preview 5 and also two new Blazor components!

Support for ASP.NET Core 3 Preview 5

The Blazor team at Microsoft are releasing updates at a rapid pace as they get closer to the September .NET Core 3.0 final release. For example, Microsoft released the ASP.NET Core 3 Preview 5 only a few days ago.

So I'm happy to report that our latest Blazor release supports the ASP.NET Core 3 Preview 5 update. For simplicity, we're calling our Blazor update Preview 5 too. Our Blazor Nuget package also uses a similar versioning system:

This lets you quickly see the version compatibility with the .NET Core preview versions.

New Components

We're also introducing two new Blazor components: Form Layout and Tabs! This brings us to a total of nine powerful DevExpress Blazor components before we've even reached our upcoming v1.0 release.

Remember, all of our Blazor components are native and written exclusively for the Blazor framework. Now, let's take a look at the new components:

New Form Layout Component

The DevExpress Form Layout component for Blazor helps you to easily create edit forms which are responsive and automatically-aligned:

This component uses the responsive features provided by the underlying Bootstrap framework. We've also added functionality to align the labels and editors on the form.

Save time by using our Blazor Form Layout component to create simple or complex form layouts.

Check out the online demo: DevExpress Blazor UI - Form Layout Demo

New Tabs Component

We've also added the new Tabs component to our set of Blazor components:

With our Tabs component, you can provide views with a simple tab strip or use it as a navigation component made up of multiple tabbed pages.

Test drive the online demo here: DevExpress Blazor UI - Tabs Demo

Blazor Name Change - Breaking Changes

In a previous update, Microsoft announced the following:

• Client-side Blazor on WebAssembly now in official preview
• Razor Components renamed back to server-side Blazor

First, dropping the 'experimental' label on client-side Blazor is good news as it shows the progress they're making. However, client-side Blazor is still not officially recommended by Microsoft.

Note: While not recommended, they do use client-side Blazor on one known production website: Try .NET. You can hear the story of "Try .NET" directly from the Microsoft Blazor PM, Dan Roth. Simply sign up for our upcoming Blazor webinar.

Microsoft also renamed "Razor Components" back to "server-side Blazor". Now Blazor's hosting models will be known as "Blazor (client-side)" and "Blazor (server-side)". Therefore, we've also decided to standardize on "Blazor" for our components too.

Honestly, I prefer this name change because it's simpler. But, it has created a few breaking changes. To address these issues we've made the following changes in this Preview 5 release:

1. We've changed the namespace from DevExpress.RazorComponents to DevExpress.Blazor
2. We've also changed the NuGet package name from DevExpress.RazorComponents to DevExpress.Blazor
3. The DevExpress.RazorComponents.dll assembly has been renamed to DevExpress.Blazor.dll
4. These two static resources have been appropriately renamed too:
   • dx-razor-components.css -> dx-blazor.css
   • dx-razor-components.js -> dx-blazor.js
5. The demo site is now located at: https://demos.devexpress.com/blazor/
6. Microsoft's preview 5 has changed the Blazor template structure. Before, you needed to register the namespace and tag helpers in the /Components/_ViewImports.cshtml file. Now, you'll need to register from the _Imports.razor file, but you'll only need to register the namespace: @using DevExpress.Blazor

Updated Guide and Demo Project

To see the changes mentioned above, please take a look at our updated github demo project and "How to create a new project" guide.

There's also a set of "Getting Started" training videos which help you learn about the Blazor framework.

Download the preview from NuGet

If you wish to test the DevExpress UI for Blazor, download the DevExpress.Blazor.nupkg from the DevExpress NuGet Early Access feed. Once you've added this feed to Visual Studio 2019, you'll see the DevExpress.BlazorComponents package:

This preview is made available under the DevExpress Preview end-user license. To gain access to the build free of charge, you will need a DevExpress.com account. You can either create a free account to test our NuGet package or you can get a free 30-day trial of all our components.

Join the Webinar

Sign up for the upcoming "Blazor - Getting Started" webinar:

Register today

Give us your feedback

Although we have many plans for more components within this new ecosystem, as with all of our future projects we rely on feedback from you, our customers, on what we should be looking at and considering. Send us emails, open up support tickets, let us know.

Along those lines, please take a moment to complete this short survey:

Thanks!

The DevExpress ASP.NET GridView (v19.1) ships with a new adaptive toolbar and number of enhancements to the batch editing feature.

Batch Edit Enhancements

Our ASP.NET WebForms and MVC GridView control allows you to edit and update multiple grid rows on the client side and send them to the server in a single request. We call this feature the 'batch edit' mode.

Endless paging

We've enhanced the 'batch edit' mode with support for 'endless paging' in this release:

If you're not familiar, the 'endless paging' mode automatically loads content as you scroll or page down.

To enable this new functionality, set the SettingsPager.Mode property to EndlessPaging:

<SettingsEditing Mode="Batch" /> <SettingsPager Mode="EndlessPaging" />

New styles for Command Buttons

The DevExpress GridView for ASP.NET WebForms and MVC ships with new three new render styles for the command buttons in batch edit mode:

• Danger
• Outline (default)
• Secondary

By default, the command buttons will use the Outline style:

Use the SettingsCommandButton.RenderMode option to change the command buttons style:

<SettingsCommandButton RenderMode="Secondary"><DeleteButton RenderMode="Danger" /></SettingsCommandButton>

Adaptive toolbar

DevExpress ASP.NET WebForms and MVC GridView toolbars now support adaptive layouts.

The toolbar can automatically resize, hide its items' text and display only icons when the browser window is resized:

Demo

To enable, set the EnableCollapseRootItemsToIcons property to true:

<dx:GridViewToolbar><SettingsAdaptivity Enabled="true"
    EnableCollapseRootItemsToIcons="true" />

If the window has a specific width, then use the CollapseRootItemsToIconsAtWindowInnerWidth property:

<dx:GridViewToolbar><SettingsAdaptivity Enabled="true"
    EnableCollapseRootItemsToIcons="true"
    CollapseRootItemsToIconsAtWindowInnerWidth="600" />

Or you can also hide items in a side-menu panel:

<dx:GridViewToolbar><SettingsAdaptivity Enabled="true" EnableAutoHideRootItems="true"
      EnableCollapseToSideMenu="true"
      CollapseToSideMenuAtWindowInnerWidth="300"
      EnableCollapseRootItemsToIcons="true"
      CollapseRootItemsToIconsAtWindowInnerWidth="700" />

Each item's adaptive priority is also configurable.

Callback name via EndCallback event

v19.1 includes an upgrade to the ASP.NET GridView's EndCallback event. Use the EndCallback event to get the command name after a callback has completed:

function OnEndCallback(s, e) {
    if (e.command == "ADDNEWROW") {
        s.Refresh();
    }
}

What Do You Think?

As always, we are interested in your feedback. Please feel free to leave comments below or open Support Center tickets as required.

Preview 7 of the DevExpress UI for Blazor is now available and it includes three big features.

New Features

We've enhanced our Blazor editor components and upgraded the online demo to highlight our excellent support for Bootstrap themes. Let's take a deeper look at these new features.

1. Form Validation

DevExpress FormLayout and Data Editor controls now support the same validation attributes as standard Blazor components. To learn more about this capability, refer to the Microsoft Documentation. To see our implementation in action, see our new Validation demo.

In the demo, our editors are highlighted in either green or red color based on their validation state:

2. ComboBox – Null Text

Our ComboBox component can now display a customizable prompt string. For example, the image below shows the editor's appearance when its value is null and its NullText property is set to "Set classification".

This serves as a helpful hint to the end user to select a value:

3. Bootstrap Theme support

Last, but not least, we've upgraded our Blazor components demo to highlight our support for Bootstrap themes! First, let's take a look at why we chose Bootstrap.

The only way to create native Blazor components was to write the server-side part from scratch, and we did that. This didn't mean, however, that we couldn't reuse client-side code from our other web product lines. Our ASP.NET Bootstrap controls feature modern render techniques and there were many reasons to have the same code for our Blazor UI:

1. They provide adaptive and mobile-friendly features
2. Are proven and work well in different browsers
3. They're lightweight, using less render, and leverage modern performance-optimization techniques

So for our Preview 7 release, we've updated our demo with a new configuration button on the top right. Clicking this button will bring up the following themes panel:

You can choose from the following:

• A standard bootstrap theme
• Two DevExpress Bootstrap themes
• 21 Bootswatch themes

Test the updated demo online here: DevExpress Blazor Themes - Online Demo

Download the Preview from NuGet

If you wish to test the DevExpress UI for Blazor, download the DevExpress.Blazor.nupkg from the DevExpress NuGet Early Access feed. Once you've added this feed to Visual Studio 2019, you'll see the DevExpress.BlazorComponents package:

This preview is made available under the DevExpress Blazor UI license. To gain access to the build free of charge, you will need a DevExpress.com account. You can create a free account to test our NuGet package and can get a free 30-day trial of all our components too.

Getting Started

The following resources will help you get started with DevExpress UI for Blazor:

• Our guide on how to create a new Blazor project
• The source code for our online demo (published on GitHub)

Join the Webinar

Sign up for the upcoming "Blazor - Getting Started" webinar:

Register today

Give us your feedback

Although we have many plans for more components within this new ecosystem, as with all of our future projects we rely on feedback from you, our customers, on what we should be looking at and considering. Send us emails, open up support tickets, let us know.

The DevExpress ASP.NET Bootstrap GridView (v19.1) ships with a new adaptive toolbar and several enhancements to the batch editing feature.

Batch Edit Enhancements

Our ASP.NET Bootstrap GridView control allows you to edit multiple grid rows on the client side and then send the changes to the server in a single request. We call this feature the 'batch edit' mode.

Callback Support

The Batch Edit feature of the DevExpress ASP.NET Bootstrap GridView is a fantastic time-saving feature.

Essentially, Batch Edit mode allows you to modify a batch of grid data on the client side and to send it to the server in a single request. In this mode, the GridView maintains all user changes on the client side until the user saves or discards them.

Unfortunately, the Batch Edit mode was limited because it would only work for the page you were currently on. It did not allow you to page, sort, group, or perform any callback-based operation until you accepted or canceled those original changes.

Good news, we've solved this callback-based limitation. We're also introducing a new Batch Edit preview dialog.

Preview Batch Changes

Let's start with the new feature: inserted, edited, and deleted edits can now be previewed and modified before data is saved in the Batch Edit mode. Take a look:

Demo

Endless Paging

We've enhanced the 'batch edit' mode with support for 'endless paging' in this release. If you're not familiar with the 'endless paging' mode, it automatically loads content as you scroll or page down:

To enable this new functionality, set the SettingsPager.Mode property to EndlessPaging:

<SettingsPager Mode="EndlessPaging" />

New styles for Command Buttons

The DevExpress ASP.NET Bootstrap GridView ships with three new render styles for the command buttons in batch edit mode:

• Outline (default)
• Secondary
• Danger

By default, the command buttons will use the Outline style:

Use the SettingsCommandButton.RenderMode option to change the command button style individually or as a collection:

<SettingsCommandButton RenderMode="Secondary"><DeleteButton RenderMode="Danger" /><CancelButton RenderMode="Danger" /><UpdateButton RenderMode="Danger" />

Callback name via EndCallback event

Our ASP.NET Bootstrap GridView's EndCallback event introduces the command name parameter in v19.1. You can now identify the operation type that has just resulted in a callback and take appropriate actions.

Adaptive toolbar

The DevExpress ASP.NET Bootstrap GridView toolbars now support adaptive layouts.

The toolbar can automatically resize, hide its items' text, and display only icons when the browser window is resized:

Demo

The BootstrapGridViewToolbar object allows you to add adaptive toolbars to different Grid View parts (inside the grid’s header/footer, outside the Panel element).

Toolbar Position

The following table lists the properties that control the toolbar's position:

Toolbar Adaptivity

The following properties control how the toolbar responds when the container’s width changes:

1. SettingsAdaptivity.EnableCollapseRootItemsToIcons - If true, the text of all items that contain icons are hidden. You can also use the item's BootstrapGridViewToolbarItem.AdaptivePriority property to specify the order in which items are hidden.
2. SettingsAdaptivity.EnableAutoHideRootItems - If true, the toolbar combines root items one by one in the root submenu until the toolbar contains the minimum number of root items (specified in the SettingsAdaptivity.MinRootItemsCount property).

What Do You Think?

As always, we are interested in your feedback. Please feel free to leave comments below or open Support Center tickets as required.