What's New in the Kendo UI jQuery Components with R2 2020

The R2 2020 release of Kendo UI is finally here and it is jam-packed with new components and features across our jQuery UI components! This includes support for jQuery 3.5, the new TileLayout and Form components (amongst a few more) and highly requested features in various components. Let’s dive right in and check out everything that is new with R2 2020 in our jQuery UI components!

jQuery 3.5.1 Support

Let’s kick things off with a big update for all jQuery developers: with R2 2020 the Kendo UI jQuery components now support jQuery 3.5.1! This does not really bring a whole new slew of features or anything, but we want to make sure that any jQuery developer can utilize the latest and greatest. To check out what jQuery 3.5.1 brings to the table, you can refer to this blog post on the official jQuery blogs. 

New Components

New Component: Form

The new Kendo UI jQuery Form component is designed to help jQuery developers build out feature rich and beautiful forms in a more intuitive way, including structuring a data model to be tied to the form, easily adding appropriate UI elements within the form, as well as validation – all baked in to one component!

To see just how the Form component can help you build forms in your applications, head on over to the jQuery Form demos.

New Component: Stepper

The Stepper component is a sleek and intuitive way to provide a user experience around anything requiring multiple steps. The Stepper includes unique visualizations for past, current, and future steps and each step has a full template letting you as the developer have full control over the content at each step.

For more information around the Kendo UI Stepper component, check out these online demos.

New Component: Textbox

With our work around the Form component we realized that we needed to include a standard Textbox component to the jQuery suite. Previously available as CSS primitives that could be added to a plain HTML input element, with R2 2020 we are introducing a standalone jQuery Textbox component.

Here’s a quick link to the Kendo UI Textbox demos to see the component in action.

New Component: TileLayout

The new Kendo UI TileLayout component is a unique component created specifically for developers looking to provide an interactive dashboard type of layout within their applications. The TileLayout consists of several tiles which can be organized by row and column spans, and once they have been rendered end-users can drag and drop the Tiles to reorganize what is displayed based on their preferences. Of course, each tile can be completely customized to let any type of content be displayed within it.

To see a demo of the TileLayout component in action head on over to the jQuery demos section for the component.

Expanded Component Features

Scheduler - Virtualization

One of the most popular feature requests for the Kendo UI Scheduler has been virtualization, a key feature for handling large sets of data within any component. Well, with R2 2020 the wait for this feature is over! The Kendo UI Scheduler now has built-in virtualization to help scroll through large collections of events within a Kendo UI Scheduler while maintaining buttery smooth scrolling.

To see the Scheduler component with virtualization enabled head on over to this online demo.

Scheduler - iCal Support

Another big feature that has been requested for the Scheduler is integration with the iCal format. I’m happy to say that as of R2 2020 iCal importand export now comes out-of-the-box with the Kendo UI Scheduler. For those not familiar, iCal is a popular data format to scheduling and calendar systems. This means that developers and users alike can easily import and export events using this common format.

For more details, check out the iCal support demo for the Kendo UI Scheduler.

Scheduler - Search & Filter Options

Keeping in line with handling large sets of data, being able to filter down items is extremely important. This is why, with R2 2020, the Kendo UI Scheduler now features a built-in Search panel for users to type in values they want to filter down available events with.

To see just how intuitive this search and filter mechanism of the Scheduler is, head on over to this online demo showcasing the feature.

DataSource - Server-Side Remote Grouping Support

The DataSource is a core concept within the Kendo UI jQuery library and provides many features that help around data binding any of the Kendo UI components. This, of course, includes the Kendo UI Grid and other components that deal with grouped data.

As a part of our ongoing effort to add quality of life improvements to these components, the Kendo UI DataSource now supports Server-Side Remote Grouping. This lets developers organize and group the data on the server and send it back to the Kendo UI components rather than dealing with data exclusively on the client-side.

There are a lot of scenarios to cover, but to see just how to configure the DataSource to take advantage of server-side grouping, head on over to this page.

Validator - New Validation Summary & Inline Validation Rendering Support

Building upon the requirements needed for the Form component, the Kendo UI Validator has added support for a Validation Summary area, as well as inline validation rendering. This can of course work with any form, but works extremely well with the Kendo UI jQuery Form component!

To see the new Validator features in action, check out this demo.

Inputs - Floating Label Support

Popularized by Material Design, Floating Labels have become a staple of any design language and web application. In an effort to support all aspects of popular design trends, the Kendo UI TextBox, NumericTextBox, and MaskedTextBox inputs now support the addition of floating labels.

While it affects a few Kendo UI jQuery inputs, check out this online demo to see floating labels in action.

Calendar, DatePicker, DateTimePicker, & TimePicker - New Rendering Options

While the the Kendo UI for jQuery date and time pickers (Calendar, DatePicker, DateTimePicker, and TimePicker) components have existed within Kendo UI for quite some time, with R2 2020 we have introduced an alternate rendering for each component to provide a new look and feel.

This design comes from feedback from existing jQuery developers along with developers from other Kendo UI flavors. The components still have their default look and feel, so to take advantage of this new rendering all that is needed is to work with a single configuration option.

While there are a few components to investigate, check out this DatePicker demo as an example,

Have Some Feedback?

Did we miss a component or feature that you were waiting for? Let us know by providing feedback in our public jQuery feedback portal! You can search for other feedback items and see if someone has submitted a similar request and then vote and comment on it, or submit your own feedback if it hasn’t been requested previously.

Join Us For a Live Webinar!

For a deeper dive in to what we covered in this blog post you should check out the live webinar myself and my Developer Advocate colleagues are hosting with the live Kendo UI Webinar on Tuesday, May 19th at 11:00 AM ET! We are covering all products within the Kendo UI bundle, and the jQuery specific session starts at 12:00 PM ET. We have limited seats for this webinar so make sure you head over and register to reserve your seat today!