Webix UI 1.9: Hotkeys for Controls and Other UI Improvements

We are glad to introduce the release of Webix UI 1.9, a JavaScript library for building fast desktop and mobile apps. The new version includes some UI improvements that speed up apps development as well as enhancements of the skins and some bug fixes.

Hotkeys for Controls

The hotkey functionality was initially included in the Webix API. But you could implement hotkeys for controls only by using custom functions.

With the new version of the library, you get the possibility to define hotkeys for controls (inputs, buttons) in one line of code. Pressing a hotkey is fully equal to clicking on the corresponding input/control. It will bring focus to the input and invoke all the attached click handlers.

hotkey for webix control

Extended Menu Functionality

With Webix 1.9, you can effortlessly add HTML links into Webix Menu just by specifying them in the configuration of items. Check the demo.
Previously, you had to add links via an event handler, which was somewhat time-consuming.

Other UI improvements

The active button now has a different styling, so detecting which button is in focus just became easier.
Calendar view supports dayTemplate property that allows customizing day cells in calendar.
DataTable has acquired new API methods: getHeaderNode() and refreshFilter().
The method strToDate will operate properly when incoming parameter is already a Date.

To learn more about new release check Webix documentation.

You can download the latest version here.

Future Plans

There are a lot of major updates ahead. For example, we are planning to add colspan and rowspan features for DataTable in the version 2.0.

The example of colspan and rowspan in Webix DataTable:

colspan and rowspan in webix grid

Rowspan in Webix datagrid:

rowspan in webix datatable

One more neat UI addition will be a header context menu for column operations in DataTable. This feature is quite useful when you want to sort or group data in grid columns or show/hide some of the grid columns based on your preferences.

Webix DataTable with contextmenu in header

Or this header context menu in DataTable may look this way:

Header Contextmenu in Webix Datable