Kendo UI for jQuery
What's New R2 2023
What's New HistoryjQuery Grid Enhancements: Compact Grid Mode and Row Resizing
The Kendo UI for jQuery Data Grid sizing capability enables you to reduce the grid size to achieve better visibility on smaller devices or to render as much data as possible. The size setting affects the inner components, including the Toolbar, Pager and editors, such as the TextBox and NumericTextBox. Additionally, the jQuery DataGrid has been enhanced with the possibility to adjust the row height of the component.
See the jQuery Grid Sizing demo
See the jQuery Row Resizing demo
jQuery DatePickers and Select Components: Adaptive Mode
The Kendo UI for jQuery DatePickers (incl. DatePicker, DateTimePicker, DateRangePicker, TimePicker and TimeDurationPicker) and Select components (MultiColumnComboBox, AutoComplete, DropDownList, DropDownTree, and MultiSelect) now support an adaptive mode that provides a mobile-friendly rendering of their popup. When the adaptive mode is enabled, the components automatically adapt to the current screen size and change their rendering accordingly.
See the jQuery DateTimePicker Adaptive Mode demo as an example
jQuery StockChart: Navigator Top Position
The jQuery StockChart component has been enhanced with a new property, enabling you to position its navigator on top (in addition to the existing bottom position).
See the jQuery StockChart demo
jQuery Scheduler: Custom Toolbar
The jQuery Scheduler component now enables you to customize its toolbar via an intuitive configuration option. Whether you want to add new buttons, rearrange existing ones, or customize their appearance, the toolbar configuration option empowers you to easily achieve the desired layout. Simply define the buttons, their order, and the associated functionalities, and the Scheduler component will reflect your custom Toolbar configuration.
See the jQuery Scheduler Custom Toolbar demo
jQuery ActionSheet: Various Enhancements
The latest update to the Kendo UI for jQuery ActionSheet component introduces a wide range of new capabilities to enhance your web application development. In this release, we have focused on expanding the component flexibility and customization options, enabling you to create stunning interfaces. The new features include:
Footer Template: enables you to customize the footer by adding interactive elements, additional information or action buttons that perfectly align with your application's workflow.
Body Template: easily create visually appealing and informative content within the body of the Actionsheet. Render dynamic data, incorporate rich media elements or even embed custom components to improve the overall user experience.
Adaptive Behavior: benefit from the adaptive design features to ensure your action sheets adjust seamlessly to different screen sizes and orientations.
Fullscreen Mode: maximize the impact of your action sheet by occupying the entire screen.
Subtitle Support: to provide clearer context and improve usability, we have introduced subtitle support for the Actionsheet component. Include subtitles for each action to provide additional information or instructions, making it easier for users to understand the purpose of each action.
Action Buttons: easily include interactive elements that trigger specific actions or operations and customize the appearance and behavior of these buttons.
Close Button: users can now easily dismiss the action sheet and focus on other elements of your application.
jQuery Gantt Enhancement: Redesigned Popup Edit Form
We have redesigned the jQuery Gantt Chart’s popup editor for user convenience. You now have more options when editing tasks, dependencies and resources:
The Edit Popup is divided into tabs to enable section editing
The Gantt component now allows configuration and editing of all data fields
Parent task editing is now feasible in the edit form of the given task
Dependencies editing via the form (previously via a separate popup)
Custom fields are now positioned in a separate tab
Styling and Customization Support of the jQuery Components within ThemeBuilder Pro
With this release, Kendo UI for jQuery festures full customization support within ThemeBuilder Pro.With custom variables for colors, typography, metrics and more, you have the power to craft exceptional designs that truly stand out.
From button icons to grid header padding, you can customize every detail of the Kendo UI for jQuery components. You can also benefit from custom fonts and icons, ensuring consistent and memorable brand identity.
jQuery Editor: Table Wizard Enhancements
The table configuration wizard in the Kendo UI for jQuery Editor component has been improved and reorganized into General and Advanced tabs for a more convenient user experience .
The General tab includes table, columns, rows and new granular cell properties, as well as a new table alignment configuration option that provides the possibility for tables to be positioned left, right or center. The Advanced tab of the editor table wizard exposes configurations for id and CSS, as well as accessibility settings for the table caption, header rows and columns.
The cell configuration dialog provides the possibility to configure cell width, height, margins, paddings, borders and more. Users also have a handy option through which they can apply the selected settings either to a specific cell or to all table cells.
See the jQuery Editor Table Wizard Demo
jQuery Scheduler: Highlighted Ongoing Events
The jQuery Scheduler component now enables you to highlight the events that are currently taking place.
See the jQuery Scheduler Highlight Ongoing Events demo
jQuery DateInput: Date Editing UX Enhancements
Now you can benefit from even more date-editing configuration options. The enhanced DateInput enables you to configure both the auto-switch behavior as well as the steps for incrementing and decrementing the various segments.
See the jQuery DateInput Date Editing demo
jQuery DateTimePicker: Start and End Values
With the latest release, you can also benefit from the startTime and endTime configuration options in the jQuery DateTimePicker, enabling you to set ranges of allowed values.
jQuery Select and Picker Components: Enhanced Demos
The adaptiveness and responsiveness of the Kendo UI for jQuery components has been a key focus of the R2 2023 release and, in addition the built-in settings we shipped, we have also strived to improve the adaptiveness of the components within our demos. You will notice the mobile-friendly behavior of the Autocomplete, ComboBox, DropDownList, DropDownTree, MultiColumnBox, MultiSelect, MultiSelectTree, DateInput, TextBox, MaskedTextBox, NumericTextBox and TextArea components.
See the jQuery MultiColumnComboBox demo as an example
Transition from Font Icons to SVG Icons
With the R2 2023 release, the default icon type in the Kendo UI for jQuery components and Kendo UI themes is changed from Font to SVG.
By eliminating the font icon inline scripts present in the themes, we have managed to reduce the security risk and improve the overall CSP compliance.
Design System Documentation Launch
One of the key release items in R2 2023 is the launch of a dedicated design system documentation site, which offers a wide range of resources, design assets and frontend documentation specifically tailored for the Telerik and Kendo UI libraries. With this release, we have included related design and frontend documentation for nearly 20 of the most crucial components.
Our ongoing dedication is to expand this site further, aiming to provide you with all the necessary tools to craft seamless and visually captivating digital experiences and design systems utilizing the power of Telerik and Kendo UI component libraries.
