Telerik blogs

Article Anchors

July is only half over and it has already been quite a month, between the 4th of July holiday in the US and a horrific hailstorm around our Sofia HQ which caused serious damage to vehicles and buildings in the area. However, our Q2’14 release of Kendo UI remained on track.

And here it is! For all who impatiently waited for the new Kendo UI installment, I am pleased to inform you that the Q2’14 bits are immediately available for download, for open source | trial | commercial users. The release is jam-packed with new widgets and functionality which underline the ‘Enterprise UI for every Desktop and Device’ theme we set for this major milestone. And what’s all about this theme, you may ask? Read on to learn more, and for those of you who prefer to ‘learn by example’, visit the online demos and look for the ‘New’ markers in the left-side navigation when delving into the pool of examples.

First, I wanted to share a few numbers/stats about this release:

  • Official AngularJS integrations in Kendo UI Core, and support as part of Kendo UI Professional
  • 3 new widgets and 2 new charts in Kendo UI Professional
  • 124 issues closed for Kendo UI Professional
  • 54 enhancements made for Kendo UI Professional
  • 2 new widgets in Kendo UI Core
  • 93 issues closed for Kendo UI Core

AngularJS integration

Following the introduction of the angular-kendo labs integration project, and support for Kendo UI’s web and mobile widgets via AngularJS directives, we reached another landmark for the Kendo UI <> AngularJS integration.

Starting Q2’14, AngularJS and Kendo UI’s directives will be shipped and maintained as part of our Kendo UI Core, Kendo UI Professional and server wrappers distributions. Additionally, we’ll provide official support for Kendo UI AngularJS integrations via the support packages available with our commercial licenses, or individually with our Premium Support option. This is great news for people using both frameworks and harvesting the full power they put into the hands of HTML and JavaScript developers. Refer to the formal license agreement AngularJS support terms for more info.

Additionally, each Kendo UI widget showcases an AngularJS integration demo – here’s one for the Mobile Drawer, for instance.

What’s new in Kendo UI Professional

This release should be exciting for developers looking for enterprise-grade widgets for line-of-business applications. It includes three of the most voted widgets on our UserVoice portal, and two additional chart types to enrich your DataViz arsenal. Furthermore, we moved the Diagram widget introduced in Q1 out of Beta and into RTM and delivered important features to several of the existing widgets.

Pivot Grid (Beta)

This powerful, long-anticipated widget (#1 voted on our UserVoice portal) allows you to process multi-dimensional data supplied via OLAP cube or JSON arrays, thus bringing BI capabilities to your web applications. It is invaluable for scenarios where data mining and analytics are required. This first release has built-in capabilities for columns, rows and measures drag & drop customization, scrolling and filtering. Make sure you first get familiar with the pivot grid fundamentals help topic and how to setup OLAP cube/XMLA to speed up the learning curve.

 

See Demos
 

Gantt

If you’ve ever wanted to have a better view of a project planning and management process, the new Gantt widget is for you. Combining a treelist view for task definitions and a schedule view for visualizing time periods and relations between tasks, it is the perfect data visualization companion for project managers who want to control and supervise their projects at any given moment. Data editing via insert, delete or edit task operations (via resizing) are supported out-of-the-box, as well as keyboard navigation and MVVM.

 

See Demos 

TreeMap

If you want to display hierarchical (tree-like) data using nested rectangles, this is where the TreeMap widget shines. Each nested rectangle in the treemap structure represents sub-nodes and you can easily distinguish parent/child items using this type of graphical representation. This can be quite useful for outputting segmentation in populations, results from political polls/elections, and so on. ‘Squarified’ and ‘Slice and Dice’ (horizontal and vertical) modes are supported via simple configuration settings.



See Demos

Waterfall and RangeBar charts

To complement our enterprise theme for this release further, we are shipping two new chart types:

  • Waterfall – illustrating the cumulative effect of successive positive and negative values
  • RangeBar – ideal to visualize value ranges over time, compared by single or multiple factors. Suitable also for financial data that presents price movements and volatility over time.

Both charts support horizontal and vertical orientation determined by the series > type attribute setting. Head on over to the demo links below to learn more.

See Waterfall Chart Demos
See RangeBar Chart Demos

Diagram RTM & Drawing API

Our diagram widget introduced in Q1 as a Beta graduated into v1, featuring several enhancements such as extended API, MVVM and VML support for older IE versions (7 and 8). We also put together for you this sample demo showcasing Visio-like experience when building and customizing your diagram in par with your preferences.



See Demos

The Drawing API exposed in this release supplies API endpoints to make use of the internal DataViz engine to draw shapes and manipulate graphical objects. Thus you can have the drawing foundation that fuels our charts, map and diagram widgets at your disposal, for building delightful graphical compositions in your apps using SVG, Canvas or VML (for IE 7/8). Yay!

See Demos

New Features for existing widgets

Worth noting are a few features that have been added to several of the existing major widgets, such as

  • Editor file attachment support via new file browser dialog
  • Grid Google-style autocomplete filtering via a filter row, quite useful for performing quick filtering operations.
  • Bubble Map layer, enabling you to display data for comparative regions on a map (based on some criterion) to be measured at a glance. 


You can see each of these features following the links below.

See Editor Demo
See Grid Demo
See Map Demo

What’s new in Kendo UI Core

Naturally, we haven’t forgotten about the open source version of our Kendo UI framework, and Kendo UI Core also gets major updates in this release. Two new widgets, a slew of fixes and enhancements and an important new feature for the DropDownList are packed in its Q2’14 installment.

ToolBar

In case you are in need of customizable adaptive toolbars for web and mobile apps, search no further. The toolbar widget lets you define elements such as toggle/split buttons, button groups, etc. as well as embed other Kendo UI widgets like dropdowns, color picker, numeric textbox, and so on. When resizing, the elements which cannot be accommodated in the visible area will be moved in the command overflow popup, displayed via the overflow anchor on the right side. And as a bonus, the toolbar can automatically morph into an Android action bar on Android devices.

 

 

See Demos

 

Context Menu

Inheriting its core features from the menu widget, the context menu comes in handy when you would like to display context options for a given element in web and mobile applications. All you need to do is specify a target and an open event (default is ‘contextmenu’, i.e. right-click).

Setting the context menu configuration via code is easy:


menu = $("#menu").kendoContextMenu({ orientation: orientation, target: "#listview-context-menu", filter: ".product", animation: { open: { effects: "fadeIn" }, duration: 500 }, select: function(e) { // Do something on select }, showOn: "click" });

See Demo

New Features for existing widgets

An important and frequently requested feature added with this release to the DropDownList widget is the ability to perform server filtering on-the-fly, when typing in the search field after opening the dropdown popup. This gives the end-user extra flexibility when interacting with the dropdown options.

 

And it takes just a single option (filter attribute setting) to enable this feature, as you can see from the following code snippet:


$("#products").kendoDropDownList({ filter: "startswith", dataTextField: "ProductName", dataValueField: "ProductID", dataSource: { transport: { read: { dataType: "jsonp", url: "http://demos.telerik.com/kendo-ui/service/Products", } } } });

See Demo

Server wrappers

As with each Kendo UI release, all new widgets receive server-side wrappers for ASP.NET MVC, Java (JSP) and PHP to facilitate developers who feel more at home with server-side instead of client-side development. This means that the widgets (and features) listed above are directly available in our UI for ASP.NET MVC, UI for JSP and UI for PHP products.

Improved online demos experience

Part of the Q2 effort was also the revamp of the online demos visuals and navigation, having the main objective to become more intuitive and adaptive when viewed either on web desktop or mobile devices. I am very pleased with the end result and hope you will also enjoy the new browsing experience.

 

To see demos for server technologies (ASP.NET MVC, JSP or PHP) or browse the online support resources for a given widget, use the navigation links at the bottom of each demo.

Demos_OtherTechnologies

Watch the Q2 Online Webinar Recording

This webinar took place on July 30 and we covered everything that’s new in Telerik Kendo UI, including: 

  • Advanced data management and data visualization additions to Kendo UI Professional: Gantt Chart, Pivot Grid, TreeMap and more. 
  • Context Menu and Toolbar widgets released as part of Telerik Kendo UI Core. 
  • Kendo UI mobile widgets support for AngularJS. 
  • New powerful demo features for all types of applications

Watch the full webinar recording.

Wait, is that all?

It’s certainly not. These are merely the major highlights in Kendo UI’s Q2’14 release, from my subjective point of view. This release is huge, and I encourage you to visit the official demos, documentation and release notes for Kendo UI | UI for ASP.NET MVC | UI for JSP | UI for PHP to see everything that’s shipped and try it out.

Trial Downloads > Kendo UI | MVC | JSP | PHP

Finally, don’t forget to share your feedback either in the comments of this blog post, or in our public forums. We are eager to know what amazing web and mobile experiences you are going to create with Kendo UI!


rahnev
About the Author

Stefan Rahnev

Stefan Rahnev (@StDiR) is Product Manager for Telerik Kendo UI living in Sofia, Bulgaria. He has been working for the company since 2005, when he started out as a regular support officer. His next steps at Telerik took him through the positions of Technical Support Director, co-team leader in one of the ASP.NET AJAX teams and unit manager for UI for ASP.NET AJAX and Kendo UI. Stefan’s main interests are web development, agile processes planning and management, client services and psychology.

Comments

Comments are disabled in preview mode.