What’s New in Telerik UI for ASP.NET MVC R2 2021

The Telerik R2 2021 release brings new sleek and feature-rich components, plus big new features to some of your favorite components.

Hey developer folks, it’s time for another massive release with new ASP.NET MVC UI components, features and tooling for your applications.

The Telerik R2 2021 release brings sleek and feature rich MVC components such as Task Board, Circular Gauge, Action Sheet and Skeleton , plus new features in the Grid, Editor, Drawer, TreeList, QR Code, Scheduler and Map components, online technical training available for both active trials and license holders and more. Read ahead the dedicated release blog post to find out a summary and a detailed description of the new release gems.

TL;DR Telerik UI for ASP.NET MVC R2 2021

• New components: Task Board, SkeletonContainer, ActionSheet and Circular Gauge
• New Grid features: Data Range Selection plus sleek option to copy or export to Chart & File
• New Editor feature: Image resizing
• New TreeList features: Filter row & row template
• New Scheduler features: Hierarchical grouping support, Year View, normal display of 24-hour events
• New QR Code features: Swiss QR Code, support for logo/image in QR Code
• New Drawer feature: Hierarchical items
• New Map feature: Support for Azure Maps
• Forums revamp
• Telerik Document Processing .doc file format support
• Online technical training: Available now for both active trials and license holders

Deep Dive into R2 2021 Release of UI for ASP.NET MVC

And if you want to learn more about the latest additions to Telerik UI for ASP.NET MVC, read ahead and see in detail all the new components, features and tooling that will help you speed up development.

New UI for ASP.NET Core TaskBoard Component

Whether you utilize it as a kanban board, agile board, workflow management board or a simple to-do list, the new TaskBoard for ASP.NET MVC was built with the intent to save you a ton of time and provide maximum flexibility through its numerous features, configuration options and events.

Telerik UI for ASP.NET MVC Task Board Component

The TaskBoard component has full built-in support for all types of CRUD operations on both column and task level, and exposes multiple events and APIs, allowing you to easily accomplish various validation scenarios. For example, limit the number of cards allowed in a column, known as WIP (work in progress) limit, or enforce rules when moving cards between the board columns.

Telerik UI for ASP.NET MVC TaskBoard Card Editing

Using the Resources color configuration option of the TaskBoard, you can quickly make tasks stand out on the board. You can associate type of work or resources assigned to a task with specific color. Alternatively, you can use the different color notations for visualizing different task statuses or task priorities such as “low,” “medium” and “high.”

Telerik UI for ASP.NET MVC TaskBoard Categorization

The TaskBoard for ASP.NET MVC also comes with multiple template options for its columns and cards, so you can render custom content, use a search panel, utilize RTL (right-to-left) support, as well as work with built-in keyboard navigation support and accessibility.

New UI for ASP.NET MVC Circular Gauge Component

We are happy to add a new Circular Gauge component to Telerik Data Visualization UI library. It has functionality and features similar to the well-known Arc Gauge but visualizes the values as a complete sleek circle.

Telerik UI for ASP.NET MVC Circular Gauge

The UI for ASP.NET MVC Circular Gauge supports full customization of the center text, scale and color capabilities. The Gauge’s visual appearance can be completely customized—you can easily set a different fill color depending on the current value or range of values, set the colors of its labels and ticks, configure the visibility of major and minor ticks, set the direction clockwise or counterclockwise, and more.

The Circular Gauge UI component exposes methods for exporting its visualization to PDF, PNG or other preferred image file format. Check out the Circular Gauge API for a complete reference of its capabilities.

Telerik UI for ASP.NET MVC Circular Gauge Customizations

New UI for ASP.NET MVC Action Sheet Component

The ActionSheet UI component encourages users to take action from a list of rendered options/buttons or alternatively dismiss it if they want to continue interacting with the application. The UI for ASP.NET MVC ActionSheet comes with multiple configuration options, events and built-in keyboard navigation and accessibility.

Telerik UI for ASP.NET MVC ActionSheet Component

Using the ActionSheet Items configuration, you can set specific attributes such as: Text, Icon, Description, Click event handler name and Group (ActionSheet items can be segregated in two groups—top and bottom).

For handling custom programming logic related to the interaction with the ActionSheet, you can subscribe to the exposed Open and Close events of the component.

New UI for ASP.NET MVC Skeleton Container Component

The new SkeletonContainer for ASP.NET MVC UI component improves user experiences by displaying a preview placeholder of your content before data gets loaded. SkeletonContainers are becoming the perfect replacement for traditional loaders because they focus on progress rather than wait times and increase the perceived performance for users.

Telerik UI for ASP.NET MVC Skeleton Component

The Telerik SkeletonContainer accepts either a template or a CSS Grid. While you have the flexibility to pass almost anything with the template, using the CSS Grid, you benefit from the Item object that has a set of handy predefined properties that give you granular control over the Skeleton configuration: ColStart, ColSpan, RowStart, RowSpan and Shape.

Telerik UI for ASP.NET MVC Skeleton Grid Integration

New UI for ASP.NET MVC Features

New Grid Advanced Selection and Export

With the R2 2021 release, we boosted the Grid for MVC with the option to select cells and ranges and export a subset of the Grid data to a chart.

Telerik UI for ASP.NET MVC Grid Range Selection & Export to Chart

The MVC Grid selection modes include:

• Individual or multiple Grid cells selection
• Grid single range selection
• Grid multiple ranges selection

Telerik UI for ASP.NET MVC Grid Range Selection

For those working with file formats such as Excel, the selected data can be easily selected and exported, or copied and pasted with the option to preserve column headers.

Telerik UI for ASP.NET MVC Grid Range Selection & Export to Excel

New Editor Feature: Image Resizing

The UI for ASP.NET MVC Editor component now offers built-in image resizing functionality via drag handles that enable users to adjust image dimensions easily.

Telerik UI for ASP.NET MVC Editor Resize Image

New TreeList Features: Filter Row, Row Template

The TreeList for ASP.NET MVC row template feature enables you to apply custom styling and content—you can render text, images, icons, link buttons and even other UI components.

Telerik UI for ASP.NET MVC TreeList Row Template

And with the new TreeList filter row feature, you can enable users with handy filtering options right beneath the column headers by setting the .Filterable property to mode row. In its default behavior, the filter row displays the corresponding filter type based on the TreeList column data types. However, you also have flexibility to set preselected filter operands or customize the filtering options with templates.

Telerik UI for ASP.NET MVC TreeList Component Filter Row

New Scheduler Features: Hierarchical Grouping Support, Year View, Normal Display of 24-hour Events

Another top UI component that received a boost in the R2 2021 release is the Scheduler for ASP.NET MVC.

With the new hierarchical resource grouping functionality, you can display the schedule of appointments associated with resources with parent-child relationship. The new grouping works in both vertical and horizontal orientation and visualizes the parent resource as a main group under which the related child resources are shown with the corresponding appointments per date/time.

Telerik UI for ASP.NET MVC Scheduler Hierarchical Grouping

Another major enhancement is the Scheduler Year View, which displays appointments in a 12-month outlook. Each day with associated appointment(s) shows a visual clue, and when clicked presents an expanded day view with all the events scheduled for that day.

Telerik UI for ASP.NET Core Scheduler Year View

The third Scheduler enhancement that is part of the R2 2021 release is the option to display the Scheduler All-Day Events (24-hour) either as an appointment in the “all day” section of the scheduler or as a normal 24-hour span event.

Telerik UI for ASP.NET MVC Scheduler >24-hour Event

New QR Code Features: Swiss QR Code, Support for Logo/Image in QR Code

With the modernization of the Swiss payment transactions with QR-bill, the QR Code component now supports the Swiss payment standard with its identifying sign of the Swiss Cross in the center.

Telerik UI for ASP.NET MVC Swiss QR Code

In addition to that, The Telerik QR Code for ASP.NET MVC also supports different types of overlay including image type, which lets you add a company logo or other custom image in the QR Code. The dimensions and size of the image are configurable and let you customize it as needed.

Telerik UI for ASP.NET MVC QR Code Image Support

New Drawer Feature: Hierarchical Items

You can now provide hierarchical structure within the Drawer component. The parent item can have its indented children by using and applying built-in classes.

Telerik UI for ASP.NET MVC Drawer Hierarchical Items

New Map Feature: Support for Azure Maps

Earlier this year, Microsoft announced the deprecation of Bing Maps in favor of Azure Maps. We ensured that our UI for ASP.NET Core component is fully compatible with Azure’s png tile API and created an example demonstrating how you can implement Azure Maps’ geospatial capabilities with our Map component.

Online Technical Training

To speed up the onboarding process and help you get started developing ASP.NET MVC apps faster, we’ve unlocked the Telerik UI for ASP.NET MVC online training for everyone with an active trial or license. The training has an approximate duration of three hours and includes several modules that help you learn at your own speed and interest.

To get started with the Telerik UI for ASP.NET MVC technical online training, visit our learning portal with all Progress Products Virtual Classroom Courses or jump directly to Telerik UI for ASP.NET MVC Online Training.

New Features in Telerik Document Processing

In the latest distribution package of UI for ASP.NET MVC, you will find Telerik.Documents.Flow.FormatProviders.Doc NuGet (part of Telerik Document Processing) that will allow you to import .doc file format, and then manipulate, convert and export it to any of the other supported format providers.

Telerik Forums Revamp

The Telerik Forums got a major update as well as a favorite place where we love hanging out. Check out the complete story of why and what in the dedicated blog post.

Telerik and Kendo UI Forums Hub

Download Now UI for ASP.NET MVC

Download and try a trial version of Telerik UI for ASP.NET MVC, or if you are an active license holder you can just grab the latest and greatest from the “Your Account” page. Share your thoughts with us on our feedback portal and help us shape the future of UI for ASP.NET MVC.

Download UI for ASP.NET MVC

Special Twitch Sessions & Webinar

Be sure to sign up for the Telerik R2 2021 release webinar and live Twitch sessions to see the newly released components and features in action:

• Telerik R2 2021 Release Webinar on Tuesday, May 18 I 11:00 am – 1:00 pm ET
• Live Twitch session on Wednesday, May 19 I 9:00 – 10:30 am ET (Blazor, WinUI, Xamarin)
• Live Twitch session on Thursday, May 20 I 1:30 – 3:00 pm ET (Blazor, WinUI, Xamarin)

Reserve Your Telerik Webinar Seat

Thank you for your continuous support and happy coding.